<!DOCTYPE html>
<!-- saved from url=(0047)https://chat3.aichatos.xyz/#/chat/1684391660325 -->
<html lang="zh-cmn-Hans"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	
	<meta name="mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-title" content="AIchatOS">
	<style cssr-id="vueuc/binder">.v-binder-follower-container {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 0;
  pointer-events: none;
  z-index: auto;
}

.v-binder-follower-content {
  position: absolute;
  z-index: auto;
}

.v-binder-follower-content > * {
  pointer-events: all;
}</style><link rel="icon" type="image/svg+xml" href="https://chat3.aichatos.xyz/favicon.svg">
	<!-- <link rel="manifest" href="https://vscode.binjie.site:7778/manifest.json" crossorigin="use-credentials"> -->
	<link rel="apple-touch-icon" href="https://chat3.aichatos.xyz/favicon.ico">
	<link rel="icon" type="image/svg+xml" href="https://chat3.aichatos.xyz/favicon.svg">
	<meta content="yes" name="apple-mobile-web-app-capable">
	<link rel="apple-touch-icon" href="https://chat3.aichatos.xyz/favicon.ico">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover">
	<title>AIchatOS</title>
	<script src="./index_files/hm.js.下载"></script><script>
		var _hmt = _hmt || [];
		(function() {
		var hm = document.createElement("script");
		hm.src = "https://hm.baidu.com/hm.js?57740daa77b2b64fc03729c7f3eed65b";
		var s = document.getElementsByTagName("script")[0]; 
		s.parentNode.insertBefore(hm, s);
		})();
		</script>
		<script type="module" crossorigin="" src="./index_files/index-a7f3e487.js.下载"></script>
		<link rel="stylesheet" href="./index_files/index-b0f8cc2a.css">
	<link rel="manifest" href="https://chat3.aichatos.xyz/manifest.webmanifest"><script id="vite-plugin-pwa:register-sw" src="./index_files/registerSW.js.下载"></script><style cssr-id="n-loading-bar">.n-loading-bar-container {

 z-index: 5999;
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 height: 2px;

}

.n-loading-bar-container.fade-in-transition-enter-active {
  transition: all 0.3s cubic-bezier(.4, 0, .2, 1)!important;
}

.n-loading-bar-container.fade-in-transition-leave-active {
  transition: all 0.8s cubic-bezier(.4, 0, .2, 1)!important;
}

.n-loading-bar-container.fade-in-transition-enter-from, .n-loading-bar-container.fade-in-transition-leave-to {
  opacity: 0;
}

.n-loading-bar-container.fade-in-transition-leave-from, .n-loading-bar-container.fade-in-transition-enter-to {
  opacity: 1;
}

.n-loading-bar-container .n-loading-bar {

 width: 100%;
 transition:
 max-width 4s linear,
 background .2s linear;
 height: var(--n-height);
 
}

.n-loading-bar-container .n-loading-bar.n-loading-bar--starting {

 background: var(--n-color-loading);
 
}

.n-loading-bar-container .n-loading-bar.n-loading-bar--finishing {

 background: var(--n-color-loading);
 transition:
 max-width .2s linear,
 background .2s linear;
 
}

.n-loading-bar-container .n-loading-bar.n-loading-bar--error {

 background: var(--n-color-error);
 transition:
 max-width .2s linear,
 background .2s linear;
 
}</style><style cssr-id="n-global">body {

 margin: 0;
 font-size: 14px;
 font-family: v-sans, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
 line-height: 1.6;
 -webkit-text-size-adjust: 100%;
 -webkit-tap-highlight-color: transparent;

}

body input {

 font-family: inherit;
 font-size: inherit;
 
}</style><style cssr-id="n-notification">.n-notification-container {

 z-index: 4000;
 position: fixed;
 overflow: visible;
 display: flex;
 flex-direction: column;
 align-items: flex-end;
 
}

.n-notification-container > .n-scrollbar {

 width: initial;
 overflow: visible;
 height: -moz-fit-content !important;
 height: fit-content !important;
 max-height: 100vh !important;
 
}

.n-notification-container > .n-scrollbar > .n-scrollbar-container {

 height: -moz-fit-content !important;
 height: fit-content !important;
 max-height: 100vh !important;
 
}

.n-notification-container > .n-scrollbar > .n-scrollbar-container .n-scrollbar-content {

 padding-top: 12px;
 padding-bottom: 33px;
 
}

.n-notification-container.n-notification-container--top, .n-notification-container.n-notification-container--top-right, .n-notification-container.n-notification-container--top-left {

 top: 12px;
 
}

.n-notification-container.n-notification-container--top.transitioning > .n-scrollbar > .n-scrollbar-container, .n-notification-container.n-notification-container--top-right.transitioning > .n-scrollbar > .n-scrollbar-container, .n-notification-container.n-notification-container--top-left.transitioning > .n-scrollbar > .n-scrollbar-container {

 min-height: 100vh !important;
 
}

.n-notification-container.n-notification-container--bottom, .n-notification-container.n-notification-container--bottom-right, .n-notification-container.n-notification-container--bottom-left {

 bottom: 12px;
 
}

.n-notification-container.n-notification-container--bottom > .n-scrollbar > .n-scrollbar-container .n-scrollbar-content, .n-notification-container.n-notification-container--bottom-right > .n-scrollbar > .n-scrollbar-container .n-scrollbar-content, .n-notification-container.n-notification-container--bottom-left > .n-scrollbar > .n-scrollbar-container .n-scrollbar-content {

 padding-bottom: 12px;
 
}

.n-notification-container.n-notification-container--bottom .n-notification-wrapper, .n-notification-container.n-notification-container--bottom-right .n-notification-wrapper, .n-notification-container.n-notification-container--bottom-left .n-notification-wrapper {

 display: flex;
 align-items: flex-end;
 margin-bottom: 0;
 margin-top: 12px;
 
}

.n-notification-container.n-notification-container--top, .n-notification-container.n-notification-container--bottom {

 left: 50%;
 transform: translateX(-50%);
 
}

.n-notification-container.n-notification-container--top .n-notification-wrapper.notification-transition-enter-from, .n-notification-container.n-notification-container--bottom .n-notification-wrapper.notification-transition-enter-from, .n-notification-container.n-notification-container--top .n-notification-wrapper.notification-transition-leave-to, .n-notification-container.n-notification-container--bottom .n-notification-wrapper.notification-transition-leave-to {

 transform: scale(0.85);
 
}

.n-notification-container.n-notification-container--top .n-notification-wrapper.notification-transition-leave-from, .n-notification-container.n-notification-container--bottom .n-notification-wrapper.notification-transition-leave-from, .n-notification-container.n-notification-container--top .n-notification-wrapper.notification-transition-enter-to, .n-notification-container.n-notification-container--bottom .n-notification-wrapper.notification-transition-enter-to {

 transform: scale(1);
 
}

.n-notification-container.n-notification-container--top .n-notification-wrapper {

 transform-origin: top center;
 
}

.n-notification-container.n-notification-container--bottom .n-notification-wrapper {

 transform-origin: bottom center;
 
}

.n-notification-container.n-notification-container--top-right .n-notification, .n-notification-container.n-notification-container--bottom-right .n-notification {

 margin-left: 28px;
 margin-right: 16px;
 
}

.n-notification-container.n-notification-container--top-left .n-notification, .n-notification-container.n-notification-container--bottom-left .n-notification {

 margin-left: 16px;
 margin-right: 28px;
 
}

.n-notification-container.n-notification-container--top-right {

 right: 0;
 
}

.n-notification-container.n-notification-container--top-right .n-notification-wrapper.notification-transition-enter-from, .n-notification-container.n-notification-container--top-right .n-notification-wrapper.notification-transition-leave-to {

 transform: translate(calc(100%), 0);
 
}

.n-notification-container.n-notification-container--top-right .n-notification-wrapper.notification-transition-leave-from, .n-notification-container.n-notification-container--top-right .n-notification-wrapper.notification-transition-enter-to {

 transform: translate(0, 0);
 
}

.n-notification-container.n-notification-container--top-left {

 left: 0;
 
}

.n-notification-container.n-notification-container--top-left .n-notification-wrapper.notification-transition-enter-from, .n-notification-container.n-notification-container--top-left .n-notification-wrapper.notification-transition-leave-to {

 transform: translate(calc(-100%), 0);
 
}

.n-notification-container.n-notification-container--top-left .n-notification-wrapper.notification-transition-leave-from, .n-notification-container.n-notification-container--top-left .n-notification-wrapper.notification-transition-enter-to {

 transform: translate(0, 0);
 
}

.n-notification-container.n-notification-container--bottom-right {

 right: 0;
 
}

.n-notification-container.n-notification-container--bottom-right .n-notification-wrapper.notification-transition-enter-from, .n-notification-container.n-notification-container--bottom-right .n-notification-wrapper.notification-transition-leave-to {

 transform: translate(calc(100%), 0);
 
}

.n-notification-container.n-notification-container--bottom-right .n-notification-wrapper.notification-transition-leave-from, .n-notification-container.n-notification-container--bottom-right .n-notification-wrapper.notification-transition-enter-to {

 transform: translate(0, 0);
 
}

.n-notification-container.n-notification-container--bottom-left {

 left: 0;
 
}

.n-notification-container.n-notification-container--bottom-left .n-notification-wrapper.notification-transition-enter-from, .n-notification-container.n-notification-container--bottom-left .n-notification-wrapper.notification-transition-leave-to {

 transform: translate(calc(-100%), 0);
 
}

.n-notification-container.n-notification-container--bottom-left .n-notification-wrapper.notification-transition-leave-from, .n-notification-container.n-notification-container--bottom-left .n-notification-wrapper.notification-transition-enter-to {

 transform: translate(0, 0);
 
}

.n-notification-container.n-notification-container--scrollable.n-notification-container--top-right {

 top: 0;
 
}

.n-notification-container.n-notification-container--scrollable.n-notification-container--top-left {

 top: 0;
 
}

.n-notification-container.n-notification-container--scrollable.n-notification-container--bottom-right {

 bottom: 0;
 
}

.n-notification-container.n-notification-container--scrollable.n-notification-container--bottom-left {

 bottom: 0;
 
}

.n-notification-container .n-notification-wrapper {

 margin-bottom: 12px;
 
}

.n-notification-container .n-notification-wrapper.notification-transition-enter-from, .n-notification-container .n-notification-wrapper.notification-transition-leave-to {

 opacity: 0;
 margin-top: 0 !important;
 margin-bottom: 0 !important;
 
}

.n-notification-container .n-notification-wrapper.notification-transition-leave-from, .n-notification-container .n-notification-wrapper.notification-transition-enter-to {

 opacity: 1;
 
}

.n-notification-container .n-notification-wrapper.notification-transition-leave-active {

 transition:
 background-color .3s var(--n-bezier),
 color .3s var(--n-bezier),
 opacity .3s var(--n-bezier),
 transform .3s var(--n-bezier-ease-in),
 max-height .3s var(--n-bezier),
 margin-top .3s linear,
 margin-bottom .3s linear,
 box-shadow .3s var(--n-bezier);
 
}

.n-notification-container .n-notification-wrapper.notification-transition-enter-active {

 transition:
 background-color .3s var(--n-bezier),
 color .3s var(--n-bezier),
 opacity .3s var(--n-bezier),
 transform .3s var(--n-bezier-ease-out),
 max-height .3s var(--n-bezier),
 margin-top .3s linear,
 margin-bottom .3s linear,
 box-shadow .3s var(--n-bezier);
 
}

.n-notification-container .n-notification {

 background-color: var(--n-color);
 color: var(--n-text-color);
 transition:
 background-color .3s var(--n-bezier),
 color .3s var(--n-bezier),
 opacity .3s var(--n-bezier),
 box-shadow .3s var(--n-bezier);
 font-family: inherit;
 font-size: var(--n-font-size);
 font-weight: 400;
 position: relative;
 display: flex;
 overflow: hidden;
 flex-shrink: 0;
 padding-left: var(--n-padding-left);
 padding-right: var(--n-padding-right);
 width: var(--n-width);
 border-radius: var(--n-border-radius);
 box-shadow: var(--n-box-shadow);
 box-sizing: border-box;
 opacity: 1;
 
}

.n-notification-container .n-notification .n-notification__avatar .n-icon {
  color: var(--n-icon-color);
}

.n-notification-container .n-notification .n-notification__avatar .n-base-icon {
  color: var(--n-icon-color);
}

.n-notification-container .n-notification.n-notification--show-avatar .n-notification-main {

 margin-left: 40px;
 width: calc(100% - 40px); 
 
}

.n-notification-container .n-notification.n-notification--closable .n-notification-main > *:first-child {
  padding-right: 20px;
}

.n-notification-container .n-notification.n-notification--closable .n-notification__close {

 position: absolute;
 top: 0;
 right: 0;
 margin: var(--n-close-margin);
 transition:
 background-color .3s var(--n-bezier),
 color .3s var(--n-bezier);
 
}

.n-notification-container .n-notification .n-notification__avatar {

 position: absolute;
 top: var(--n-padding-top);
 left: var(--n-padding-left);
 width: 28px;
 height: 28px;
 font-size: 28px;
 display: flex;
 align-items: center;
 justify-content: center;
 
}

.n-notification-container .n-notification .n-notification__avatar .n-icon {
transition: color .3s var(--n-bezier);
}

.n-notification-container .n-notification .n-notification-main {

 padding-top: var(--n-padding-top);
 padding-bottom: var(--n-padding-bottom);
 box-sizing: border-box;
 display: flex;
 flex-direction: column;
 margin-left: 8px;
 width: calc(100% - 8px);
 
}

.n-notification-container .n-notification .n-notification-main .n-notification-main-footer {

 display: flex;
 align-items: center;
 justify-content: space-between;
 margin-top: 12px;
 
}

.n-notification-container .n-notification .n-notification-main .n-notification-main-footer .n-notification-main-footer__meta {

 font-size: var(--n-meta-font-size);
 transition: color .3s var(--n-bezier-ease-out);
 color: var(--n-description-text-color);
 
}

.n-notification-container .n-notification .n-notification-main .n-notification-main-footer .n-notification-main-footer__action {

 cursor: pointer;
 transition: color .3s var(--n-bezier-ease-out);
 color: var(--n-action-text-color);
 
}

.n-notification-container .n-notification .n-notification-main .n-notification-main__header {

 font-weight: var(--n-title-font-weight);
 font-size: var(--n-title-font-size);
 transition: color .3s var(--n-bezier-ease-out);
 color: var(--n-title-text-color);
 
}

.n-notification-container .n-notification .n-notification-main .n-notification-main__description {

 margin-top: 8px;
 font-size: var(--n-description-font-size);
 transition: color .3s var(--n-bezier-ease-out);
 color: var(--n-description-text-color);
 
}

.n-notification-container .n-notification .n-notification-main .n-notification-main__content {

 line-height: var(--n-line-height);
 margin: 12px 0 0 0;
 font-family: inherit;
 white-space: pre-wrap;
 word-wrap: break-word;
 transition: color .3s var(--n-bezier-ease-out);
 color: var(--n-text-color);
 
}

.n-notification-container .n-notification .n-notification-main .n-notification-main__content:first-child {
  margin: 0;
}</style><style cssr-id="n-layout">.n-layout {

 color: var(--n-text-color);
 background-color: var(--n-color);
 box-sizing: border-box;
 position: relative;
 z-index: auto;
 flex: auto;
 overflow: hidden;
 transition:
 box-shadow .3s var(--n-bezier),
 background-color .3s var(--n-bezier),
 color .3s var(--n-bezier);

}

.n-layout .n-layout-scroll-container {

 overflow-x: hidden;
 box-sizing: border-box;
 height: 100%;
 
}

.n-layout.n-layout--absolute-positioned {

 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 
}</style><style cssr-id="n-layout-sider">.n-layout-sider {

 flex-shrink: 0;
 box-sizing: border-box;
 position: relative;
 z-index: 1;
 color: var(--n-text-color);
 transition:
 color .3s var(--n-bezier),
 border-color .3s var(--n-bezier),
 min-width .3s var(--n-bezier),
 max-width .3s var(--n-bezier),
 transform .3s var(--n-bezier),
 background-color .3s var(--n-bezier);
 background-color: var(--n-color);
 display: flex;
 justify-content: flex-end;

}

.n-layout-sider.n-layout-sider--bordered .n-layout-sider__border {

 content: "";
 position: absolute;
 top: 0;
 bottom: 0;
 width: 1px;
 background-color: var(--n-border-color);
 transition: background-color .3s var(--n-bezier);
 
}

.n-layout-sider .n-layout-sider__left-placement.n-layout-sider__left-placement--bordered .n-layout-sider__border {

 right: 0;
 
}

.n-layout-sider.n-layout-sider--right-placement {

 justify-content: flex-start;
 
}

.n-layout-sider.n-layout-sider--right-placement.n-layout-sider--bordered .n-layout-sider__border {

 left: 0;
 
}

.n-layout-sider.n-layout-sider--right-placement.n-layout-sider--collapsed .n-layout-toggle-button .n-base-icon {

 transform: rotate(180deg);
 
}

.n-layout-sider.n-layout-sider--right-placement.n-layout-sider--collapsed .n-layout-toggle-bar:hover .n-layout-toggle-bar__top {
  transform: rotate(-12deg) scale(1.15) translateY(-2px);
}

.n-layout-sider.n-layout-sider--right-placement.n-layout-sider--collapsed .n-layout-toggle-bar:hover .n-layout-toggle-bar__bottom {
  transform: rotate(12deg) scale(1.15) translateY(2px);
}

.n-layout-sider.n-layout-sider--right-placement .n-layout-toggle-button {

 left: 0;
 transform: translateX(-50%) translateY(-50%);
 
}

.n-layout-sider.n-layout-sider--right-placement .n-layout-toggle-button .n-base-icon {

 transform: rotate(0);
 
}

.n-layout-sider.n-layout-sider--right-placement .n-layout-toggle-bar {

 left: -28px;
 transform: rotate(180deg);
 
}

.n-layout-sider.n-layout-sider--right-placement .n-layout-toggle-bar:hover .n-layout-toggle-bar__top {
  transform: rotate(12deg) scale(1.15) translateY(-2px);
}

.n-layout-sider.n-layout-sider--right-placement .n-layout-toggle-bar:hover .n-layout-toggle-bar__bottom {
  transform: rotate(-12deg) scale(1.15) translateY(2px);
}

.n-layout-sider.n-layout-sider--collapsed .n-layout-toggle-bar:hover .n-layout-toggle-bar__top {
  transform: rotate(-12deg) scale(1.15) translateY(-2px);
}

.n-layout-sider.n-layout-sider--collapsed .n-layout-toggle-bar:hover .n-layout-toggle-bar__bottom {
  transform: rotate(12deg) scale(1.15) translateY(2px);
}

.n-layout-sider.n-layout-sider--collapsed .n-layout-toggle-button .n-base-icon {

 transform: rotate(0);
 
}

.n-layout-sider .n-layout-toggle-button {

 transition:
 color .3s var(--n-bezier),
 right .3s var(--n-bezier),
 left .3s var(--n-bezier),
 border-color .3s var(--n-bezier),
 background-color .3s var(--n-bezier);
 cursor: pointer;
 width: 24px;
 height: 24px;
 position: absolute;
 top: 50%;
 right: 0;
 border-radius: 50%;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 18px;
 color: var(--n-toggle-button-icon-color);
 border: var(--n-toggle-button-border);
 background-color: var(--n-toggle-button-color);
 box-shadow: 0 2px 4px 0px rgba(0, 0, 0, .06);
 transform: translateX(50%) translateY(-50%);
 z-index: 1;
 
}

.n-layout-sider .n-layout-toggle-button .n-base-icon {

 transition: transform .3s var(--n-bezier);
 transform: rotate(180deg);
 
}

.n-layout-sider .n-layout-toggle-bar {

 cursor: pointer;
 height: 72px;
 width: 32px;
 position: absolute;
 top: calc(50% - 36px);
 right: -28px;
 
}

.n-layout-sider .n-layout-toggle-bar .n-layout-toggle-bar__top, .n-layout-sider .n-layout-toggle-bar .n-layout-toggle-bar__bottom {

 position: absolute;
 width: 4px;
 border-radius: 2px;
 height: 38px;
 left: 14px;
 transition: 
 background-color .3s var(--n-bezier),
 transform .3s var(--n-bezier);
 
}

.n-layout-sider .n-layout-toggle-bar .n-layout-toggle-bar__bottom {

 position: absolute;
 top: 34px;
 
}

.n-layout-sider .n-layout-toggle-bar:hover .n-layout-toggle-bar__top {
  transform: rotate(12deg) scale(1.15) translateY(-2px);
}

.n-layout-sider .n-layout-toggle-bar:hover .n-layout-toggle-bar__bottom {
  transform: rotate(-12deg) scale(1.15) translateY(2px);
}

.n-layout-sider .n-layout-toggle-bar .n-layout-toggle-bar__top, .n-layout-sider .n-layout-toggle-bar .n-layout-toggle-bar__bottom {
  background-color: var(--n-toggle-bar-color);
}

.n-layout-sider .n-layout-toggle-bar:hover .n-layout-toggle-bar__top, .n-layout-sider .n-layout-toggle-bar:hover .n-layout-toggle-bar__bottom {
  background-color: var(--n-toggle-bar-color-hover);
}

.n-layout-sider .n-layout-sider__border {

 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 width: 1px;
 transition: background-color .3s var(--n-bezier);
 
}

.n-layout-sider .n-layout-sider-scroll-container {

 flex-grow: 1;
 flex-shrink: 0;
 box-sizing: border-box;
 height: 100%;
 opacity: 0;
 transition: opacity .3s var(--n-bezier);
 max-width: 100%;
 
}

.n-layout-sider.n-layout-sider--show-content .n-layout-sider-scroll-container {
  opacity: 1;
}

.n-layout-sider.n-layout-sider--absolute-positioned {

 position: absolute;
 left: 0;
 top: 0;
 bottom: 0;
 
}</style><style cssr-id="n-button">.n-button {

 margin: 0;
 font-weight: var(--n-font-weight);
 line-height: 1;
 font-family: inherit;
 padding: var(--n-padding);
 height: var(--n-height);
 font-size: var(--n-font-size);
 border-radius: var(--n-border-radius);
 color: var(--n-text-color);
 background-color: var(--n-color);
 width: var(--n-width);
 white-space: nowrap;
 outline: none;
 position: relative;
 z-index: auto;
 border: none;
 display: inline-flex;
 flex-wrap: nowrap;
 flex-shrink: 0;
 align-items: center;
 justify-content: center;
 user-select: none;
 -webkit-user-select: none;
 text-align: center;
 cursor: pointer;
 text-decoration: none;
 transition:
 color .3s var(--n-bezier),
 background-color .3s var(--n-bezier),
 opacity .3s var(--n-bezier),
 border-color .3s var(--n-bezier);
 
}

.n-button.n-button--color .n-button__border {
  border-color: var(--n-border-color);
}

.n-button.n-button--color.n-button--disabled .n-button__border {
  border-color: var(--n-border-color-disabled);
}

.n-button.n-button--color:not(.n-button--disabled):focus .n-button__state-border {
  border-color: var(--n-border-color-focus);
}

.n-button.n-button--color:not(.n-button--disabled):hover .n-button__state-border {
  border-color: var(--n-border-color-hover);
}

.n-button.n-button--color:not(.n-button--disabled):active .n-button__state-border {
  border-color: var(--n-border-color-pressed);
}

.n-button.n-button--color:not(.n-button--disabled).n-button--pressed .n-button__state-border {
  border-color: var(--n-border-color-pressed);
}

.n-button.n-button--disabled {
  background-color: var(--n-color-disabled);
  color: var(--n-text-color-disabled);
}

.n-button.n-button--disabled .n-button__border {
  border: var(--n-border-disabled);
}

.n-button:not(.n-button--disabled):focus {
  background-color: var(--n-color-focus);
  color: var(--n-text-color-focus);
}

.n-button:not(.n-button--disabled):focus .n-button__state-border {
  border: var(--n-border-focus);
}

.n-button:not(.n-button--disabled):hover {
  background-color: var(--n-color-hover);
  color: var(--n-text-color-hover);
}

.n-button:not(.n-button--disabled):hover .n-button__state-border {
  border: var(--n-border-hover);
}

.n-button:not(.n-button--disabled):active {
  background-color: var(--n-color-pressed);
  color: var(--n-text-color-pressed);
}

.n-button:not(.n-button--disabled):active .n-button__state-border {
  border: var(--n-border-pressed);
}

.n-button:not(.n-button--disabled).n-button--pressed {
  background-color: var(--n-color-pressed);
  color: var(--n-text-color-pressed);
}

.n-button:not(.n-button--disabled).n-button--pressed .n-button__state-border {
  border: var(--n-border-pressed);
}

.n-button.n-button--loading {
cursor: wait;
}

.n-button .n-base-wave {

 pointer-events: none;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 animation-iteration-count: 1;
 animation-duration: var(--n-ripple-duration);
 animation-timing-function: var(--n-bezier-ease-out), var(--n-bezier-ease-out);
 
}

.n-button .n-base-wave.n-base-wave--active {
  z-index: 1;
  animation-name: button-wave-spread, button-wave-opacity;
}

.n-button .n-button__border, .n-button .n-button__state-border {

 position: absolute;
 left: 0;
 top: 0;
 right: 0;
 bottom: 0;
 border-radius: inherit;
 transition: border-color .3s var(--n-bezier);
 pointer-events: none;
 
}

.n-button .n-button__border {
  border: var(--n-border);
}

.n-button .n-button__state-border {
  border: var(--n-border);
  border-color: #0000;
  z-index: 1;
}

.n-button .n-button__icon {

 margin: var(--n-icon-margin);
 margin-left: 0;
 height: var(--n-icon-size);
 width: var(--n-icon-size);
 max-width: var(--n-icon-size);
 font-size: var(--n-icon-size);
 position: relative;
 flex-shrink: 0;
 
}

.n-button .n-button__icon .n-icon-slot {

 height: var(--n-icon-size);
 width: var(--n-icon-size);
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
 display: flex;
 align-items: center;
 justify-content: center;
 
}

.n-button .n-button__icon .n-icon-slot.icon-switch-transition-enter-from, .n-button .n-button__icon .n-icon-slot.icon-switch-transition-leave-to {
  transform: translateY(-50%) scale(0.75);
  left: 0;
  top: 50%;
  opacity: 0;
}

.n-button .n-button__icon .n-icon-slot.icon-switch-transition-enter-to, .n-button .n-button__icon .n-icon-slot.icon-switch-transition-leave-from {
  transform: scale(1) translateY(-50%);
  left: 0;
  top: 50%;
  opacity: 1;
}

.n-button .n-button__icon .n-icon-slot.icon-switch-transition-enter-active, .n-button .n-button__icon .n-icon-slot.icon-switch-transition-leave-active {
  transform-origin: center;
  position: absolute;
  left: 0;
  top: 50%;
  transition: all .3s cubic-bezier(.4, 0, .2, 1) !important;
}

.n-button .n-button__icon.fade-in-width-expand-transition-leave-from, .n-button .n-button__icon.fade-in-width-expand-transition-enter-to {
  opacity: 1;
}

.n-button .n-button__icon.fade-in-width-expand-transition-leave-to, .n-button .n-button__icon.fade-in-width-expand-transition-enter-from {

 opacity: 0!important;
 margin-left: 0!important;
 margin-right: 0!important;
 
}

.n-button .n-button__icon.fade-in-width-expand-transition-leave-active {

 overflow: hidden;
 transition:
 opacity .2s cubic-bezier(.4, 0, .2, 1),
 max-width .2s cubic-bezier(.4, 0, .2, 1) .1s,
 margin-left .2s cubic-bezier(.4, 0, .2, 1) .1s,
 margin-right .2s cubic-bezier(.4, 0, .2, 1) .1s;
 
}

.n-button .n-button__icon.fade-in-width-expand-transition-enter-active {

 overflow: hidden;
 transition:
 opacity .2s cubic-bezier(.4, 0, .2, 1) .1s,
 max-width .2s cubic-bezier(.4, 0, .2, 1),
 margin-left .2s cubic-bezier(.4, 0, .2, 1),
 margin-right .2s cubic-bezier(.4, 0, .2, 1);
 
}

.n-button .n-button__content {

 display: flex;
 align-items: center;
 flex-wrap: nowrap;
 min-width: 0;
 
}

.n-button .n-button__content ~ .n-button__icon {
  margin: var(--n-icon-margin);
  margin-right: 0;
}

.n-button.n-button--block {

 display: flex;
 width: 100%;
 
}

.n-button.n-button--dashed .n-button__border, .n-button.n-button--dashed .n-button__state-border {
  border-style: dashed !important;
}

.n-button.n-button--disabled {
  cursor: not-allowed;
  opacity: var(--n-opacity-disabled);
}

@keyframes button-wave-spread {
  from {
    box-shadow: 0 0 0.5px 0 var(--n-ripple-color);
  }
  to {
    box-shadow: 0 0 0.5px 4.5px var(--n-ripple-color);
  }
}

@keyframes button-wave-opacity {
  from {
    opacity: var(--n-wave-opacity);
  }
  to {
    opacity: 0;
  }
}</style><style cssr-id="n-base-wave">.n-base-wave {

 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 border-radius: inherit;

}</style><style cssr-id="n-scrollbar">.n-scrollbar {

 overflow: hidden;
 position: relative;
 z-index: auto;
 height: 100%;
 width: 100%;

}

.n-scrollbar > .n-scrollbar-container {

 width: 100%;
 overflow: scroll;
 height: 100%;
 max-height: inherit;
 scrollbar-width: none;
 
}

.n-scrollbar > .n-scrollbar-container::-webkit-scrollbar, .n-scrollbar > .n-scrollbar-container::-webkit-scrollbar-track-piece, .n-scrollbar > .n-scrollbar-container::-webkit-scrollbar-thumb {

 width: 0;
 height: 0;
 display: none;
 
}

.n-scrollbar > .n-scrollbar-container > .n-scrollbar-content {

 box-sizing: border-box;
 min-width: 100%;
 
}

.n-scrollbar > .n-scrollbar-rail, .n-scrollbar + .n-scrollbar-rail {

 position: absolute;
 pointer-events: none;
 user-select: none;
 -webkit-user-select: none;
 
}

.n-scrollbar > .n-scrollbar-rail.n-scrollbar-rail--horizontal, .n-scrollbar + .n-scrollbar-rail.n-scrollbar-rail--horizontal {

 left: 2px;
 right: 2px;
 bottom: 4px;
 height: var(--n-scrollbar-height);
 
}

.n-scrollbar > .n-scrollbar-rail.n-scrollbar-rail--horizontal > .n-scrollbar-rail__scrollbar, .n-scrollbar + .n-scrollbar-rail.n-scrollbar-rail--horizontal > .n-scrollbar-rail__scrollbar {

 height: var(--n-scrollbar-height);
 border-radius: var(--n-scrollbar-border-radius);
 right: 0;
 
}

.n-scrollbar > .n-scrollbar-rail.n-scrollbar-rail--vertical, .n-scrollbar + .n-scrollbar-rail.n-scrollbar-rail--vertical {

 right: 4px;
 top: 2px;
 bottom: 2px;
 width: var(--n-scrollbar-width);
 
}

.n-scrollbar > .n-scrollbar-rail.n-scrollbar-rail--vertical > .n-scrollbar-rail__scrollbar, .n-scrollbar + .n-scrollbar-rail.n-scrollbar-rail--vertical > .n-scrollbar-rail__scrollbar {

 width: var(--n-scrollbar-width);
 border-radius: var(--n-scrollbar-border-radius);
 bottom: 0;
 
}

.n-scrollbar > .n-scrollbar-rail.n-scrollbar-rail--disabled > .n-scrollbar-rail__scrollbar, .n-scrollbar + .n-scrollbar-rail.n-scrollbar-rail--disabled > .n-scrollbar-rail__scrollbar {
  pointer-events: none;
}

.n-scrollbar > .n-scrollbar-rail > .n-scrollbar-rail__scrollbar, .n-scrollbar + .n-scrollbar-rail > .n-scrollbar-rail__scrollbar {

 position: absolute;
 cursor: pointer;
 pointer-events: all;
 background-color: var(--n-scrollbar-color);
 transition: background-color .2s var(--n-scrollbar-bezier);
 
}

.n-scrollbar > .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-enter-active, .n-scrollbar + .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-enter-active {
  transition: all 0.2s cubic-bezier(.4, 0, .2, 1)!important;
}

.n-scrollbar > .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-leave-active, .n-scrollbar + .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-leave-active {
  transition: all 0.2s cubic-bezier(.4, 0, .2, 1)!important;
}

.n-scrollbar > .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-enter-from, .n-scrollbar + .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-enter-from, .n-scrollbar > .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-leave-to, .n-scrollbar + .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-leave-to {
  opacity: 0;
}

.n-scrollbar > .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-leave-from, .n-scrollbar + .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-leave-from, .n-scrollbar > .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-enter-to, .n-scrollbar + .n-scrollbar-rail > .n-scrollbar-rail__scrollbar.fade-in-transition-enter-to {
  opacity: 1;
}

.n-scrollbar > .n-scrollbar-rail > .n-scrollbar-rail__scrollbar:hover, .n-scrollbar + .n-scrollbar-rail > .n-scrollbar-rail__scrollbar:hover {
  background-color: var(--n-scrollbar-color-hover);
}</style><style cssr-id="n-popconfirm">.n-popconfirm .n-popconfirm__body {

 font-size: var(--n-font-size);
 display: flex;
 align-items: center;
 flex-wrap: nowrap;
 position: relative;
 
}

.n-popconfirm .n-popconfirm__body .n-popconfirm__icon {

 display: flex;
 font-size: var(--n-icon-size);
 color: var(--n-icon-color);
 transition: color .3s var(--n-bezier);
 margin: 0 8px 0 0;
 
}

.n-popconfirm .n-popconfirm__action {

 display: flex;
 justify-content: flex-end;
 
}

.n-popconfirm .n-popconfirm__action:not(:first-child) {
margin-top: 8px
}

.n-popconfirm .n-popconfirm__action .n-button:not(:last-child) {
margin-right: 8px;
}</style><style cssr-id="n-popover">.n-popover {

 transition:
 box-shadow .3s var(--n-bezier),
 background-color .3s var(--n-bezier),
 color .3s var(--n-bezier);
 position: relative;
 font-size: var(--n-font-size);
 color: var(--n-text-color);
 box-shadow: var(--n-box-shadow);
 word-break: break-word;
 
}

.n-popover > .n-scrollbar {

 height: inherit;
 max-height: inherit;
 
}

.n-popover:not(.n-popover--raw) {

 background-color: var(--n-color);
 border-radius: var(--n-border-radius);
 
}

.n-popover:not(.n-popover--raw):not(.n-popover--scrollable):not(.n-popover--show-header-or-footer) {
padding: var(--n-padding);
}

.n-popover .n-popover__header {

 padding: var(--n-padding);
 border-bottom: 1px solid var(--n-divider-color);
 transition: border-color .3s var(--n-bezier);
 
}

.n-popover .n-popover__footer {

 padding: var(--n-padding);
 border-top: 1px solid var(--n-divider-color);
 transition: border-color .3s var(--n-bezier);
 
}

.n-popover.n-popover--scrollable .n-popover__content, .n-popover.n-popover--show-header-or-footer .n-popover__content {

 padding: var(--n-padding);
 
}

.n-popover-shared {

 transform-origin: inherit;
 
}

.n-popover-shared .n-popover-arrow-wrapper {

 position: absolute;
 overflow: hidden;
 pointer-events: none;
 
}

.n-popover-shared .n-popover-arrow-wrapper .n-popover-arrow {

 transition: background-color .3s var(--n-bezier);
 position: absolute;
 display: block;
 width: calc(var(--n-arrow-height) * 1.414);
 height: calc(var(--n-arrow-height) * 1.414);
 box-shadow: 0 0 8px 0 rgba(0, 0, 0, .12);
 transform: rotate(45deg);
 background-color: var(--n-color);
 pointer-events: all;
 
}

.n-popover-shared.popover-transition-enter-from, .n-popover-shared.popover-transition-leave-to {

 opacity: 0;
 transform: scale(.85);
 
}

.n-popover-shared.popover-transition-enter-to, .n-popover-shared.popover-transition-leave-from {

 transform: scale(1);
 opacity: 1;
 
}

.n-popover-shared.popover-transition-enter-active {

 transition:
 box-shadow .3s var(--n-bezier),
 background-color .3s var(--n-bezier),
 color .3s var(--n-bezier),
 opacity .15s var(--n-bezier-ease-out),
 transform .15s var(--n-bezier-ease-out);
 
}

.n-popover-shared.popover-transition-leave-active {

 transition:
 box-shadow .3s var(--n-bezier),
 background-color .3s var(--n-bezier),
 color .3s var(--n-bezier),
 opacity .15s var(--n-bezier-ease-in),
 transform .15s var(--n-bezier-ease-in);
 
}

[v-placement="top-start"] > .n-popover-shared {

 margin-bottom: var(--n-space);
 
}

[v-placement="top-start"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-bottom: var(--n-space-arrow);
 
}

[v-placement="top-start"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="top-start"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 top: 100%;
 bottom: auto;
 height: var(--n-space-arrow);
 
}

[v-placement="top-start"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 top: calc(var(--n-arrow-height) * 1.414 / -2);
 left: calc(var(--n-arrow-offset) - var(--v-offset-left));
 
}

[v-placement="top"] > .n-popover-shared {

 margin-bottom: var(--n-space);
 
}

[v-placement="top"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-bottom: var(--n-space-arrow);
 
}

[v-placement="top"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="top"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 top: 100%;
 bottom: auto;
 height: var(--n-space-arrow);
 
}

[v-placement="top"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 top: calc(var(--n-arrow-height) * 1.414 / -2);
 transform: translateX(calc(var(--n-arrow-height) * 1.414 / -2)) rotate(45deg);
 left: 50%;
 
}

[v-placement="top-end"] > .n-popover-shared {

 margin-bottom: var(--n-space);
 
}

[v-placement="top-end"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-bottom: var(--n-space-arrow);
 
}

[v-placement="top-end"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="top-end"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 top: 100%;
 bottom: auto;
 height: var(--n-space-arrow);
 
}

[v-placement="top-end"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 top: calc(var(--n-arrow-height) * 1.414 / -2);
 right: calc(var(--n-arrow-offset) + var(--v-offset-left));
 
}

[v-placement="bottom-start"] > .n-popover-shared {

 margin-top: var(--n-space);
 
}

[v-placement="bottom-start"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-top: var(--n-space-arrow);
 
}

[v-placement="bottom-start"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="bottom-start"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 bottom: 100%;
 top: auto;
 height: var(--n-space-arrow);
 
}

[v-placement="bottom-start"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 bottom: calc(var(--n-arrow-height) * 1.414 / -2);
 left: calc(var(--n-arrow-offset) - var(--v-offset-left));
 
}

[v-placement="bottom"] > .n-popover-shared {

 margin-top: var(--n-space);
 
}

[v-placement="bottom"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-top: var(--n-space-arrow);
 
}

[v-placement="bottom"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="bottom"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 bottom: 100%;
 top: auto;
 height: var(--n-space-arrow);
 
}

[v-placement="bottom"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 bottom: calc(var(--n-arrow-height) * 1.414 / -2);
 transform: translateX(calc(var(--n-arrow-height) * 1.414 / -2)) rotate(45deg);
 left: 50%;
 
}

[v-placement="bottom-end"] > .n-popover-shared {

 margin-top: var(--n-space);
 
}

[v-placement="bottom-end"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-top: var(--n-space-arrow);
 
}

[v-placement="bottom-end"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="bottom-end"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 bottom: 100%;
 top: auto;
 height: var(--n-space-arrow);
 
}

[v-placement="bottom-end"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 bottom: calc(var(--n-arrow-height) * 1.414 / -2);
 right: calc(var(--n-arrow-offset) + var(--v-offset-left));
 
}

[v-placement="left-start"] > .n-popover-shared {

 margin-right: var(--n-space);
 
}

[v-placement="left-start"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-right: var(--n-space-arrow);
 
}

[v-placement="left-start"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="left-start"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 left: 100%;
 right: auto;
 width: var(--n-space-arrow);
 
}

[v-placement="left-start"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 left: calc(var(--n-arrow-height) * 1.414 / -2);
 top: calc(var(--n-arrow-offset-vertical) - var(--v-offset-top));
 
}

[v-placement="left"] > .n-popover-shared {

 margin-right: var(--n-space);
 
}

[v-placement="left"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-right: var(--n-space-arrow);
 
}

[v-placement="left"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="left"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 left: 100%;
 right: auto;
 width: var(--n-space-arrow);
 
}

[v-placement="left"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 left: calc(var(--n-arrow-height) * 1.414 / -2);
 transform: translateY(calc(var(--n-arrow-height) * 1.414 / -2)) rotate(45deg);
 top: 50%;
 
}

[v-placement="left-end"] > .n-popover-shared {

 margin-right: var(--n-space);
 
}

[v-placement="left-end"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-right: var(--n-space-arrow);
 
}

[v-placement="left-end"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="left-end"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 left: 100%;
 right: auto;
 width: var(--n-space-arrow);
 
}

[v-placement="left-end"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 left: calc(var(--n-arrow-height) * 1.414 / -2);
 bottom: calc(var(--n-arrow-offset-vertical) + var(--v-offset-top));
 
}

[v-placement="right-start"] > .n-popover-shared {

 margin-left: var(--n-space);
 
}

[v-placement="right-start"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-left: var(--n-space-arrow);
 
}

[v-placement="right-start"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="right-start"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 right: 100%;
 left: auto;
 width: var(--n-space-arrow);
 
}

[v-placement="right-start"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 right: calc(var(--n-arrow-height) * 1.414 / -2);
 top: calc(var(--n-arrow-offset-vertical) - var(--v-offset-top));
 
}

[v-placement="right"] > .n-popover-shared {

 margin-left: var(--n-space);
 
}

[v-placement="right"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-left: var(--n-space-arrow);
 
}

[v-placement="right"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="right"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 right: 100%;
 left: auto;
 width: var(--n-space-arrow);
 
}

[v-placement="right"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 right: calc(var(--n-arrow-height) * 1.414 / -2);
 transform: translateY(calc(var(--n-arrow-height) * 1.414 / -2)) rotate(45deg);
 top: 50%;
 
}

[v-placement="right-end"] > .n-popover-shared {

 margin-left: var(--n-space);
 
}

[v-placement="right-end"] > .n-popover-shared.n-popover-shared--show-arrow {

 margin-left: var(--n-space-arrow);
 
}

[v-placement="right-end"] > .n-popover-shared.n-popover-shared--overlap {

 margin: 0;
 
}

[v-placement="right-end"] > .n-popover-shared > .n-popover-arrow-wrapper {

 right: 0;
 left: 0;
 top: 0;
 bottom: 0;
 right: 100%;
 left: auto;
 width: var(--n-space-arrow);
 
}

[v-placement="right-end"] > .n-popover-shared > .n-popover-arrow-wrapper .n-popover-arrow {

 right: calc(var(--n-arrow-height) * 1.414 / -2);
 bottom: calc(var(--n-arrow-offset-vertical) + var(--v-offset-top));
 
}

[v-placement="right-start"] > .n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
top: calc(max(calc((var(--v-target-height, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset-vertical)) - var(--v-offset-top));
}

[v-placement="left-start"] > .n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
top: calc(max(calc((var(--v-target-height, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset-vertical)) - var(--v-offset-top));
}

[v-placement="top-end"] > .n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
right: calc(max(calc((var(--v-target-width, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset)) + var(--v-offset-left));
}

[v-placement="bottom-end"] > .n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
right: calc(max(calc((var(--v-target-width, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset)) + var(--v-offset-left));
}

[v-placement="right-end"] > .n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
bottom: calc(max(calc((var(--v-target-height, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset-vertical)) + var(--v-offset-top));
}

[v-placement="left-end"] > .n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
bottom: calc(max(calc((var(--v-target-height, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset-vertical)) + var(--v-offset-top));
}

[v-placement="top-start"] > .n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
left: calc(max(calc((var(--v-target-width, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset)) - var(--v-offset-left));
}

[v-placement="bottom-start"] > .n-popover-shared.n-popover-shared--center-arrow .n-popover-arrow {
left: calc(max(calc((var(--v-target-width, 0px) - var(--n-arrow-height) * 1.414) / 2), var(--n-arrow-offset)) - var(--v-offset-left));
}</style><style cssr-id="n-avatar">.n-avatar {

 width: var(--n-merged-size);
 height: var(--n-merged-size);
 color: #FFF;
 font-size: var(--n-font-size);
 display: inline-flex;
 position: relative;
 overflow: hidden;
 text-align: center;
 border: var(--n-border);
 border-radius: var(--n-border-radius);
 --n-merged-color: var(--n-color);
 background-color: var(--n-merged-color);
 transition:
 border-color .3s var(--n-bezier),
 background-color .3s var(--n-bezier),
 color .3s var(--n-bezier);

}

.n-avatar .n-modal, .n-avatar .n-drawer {
--n-merged-color: var(--n-color-modal);
}

.n-avatar .n-popover {
--n-merged-color: var(--n-color-popover);
}

.n-avatar img {

 width: 100%;
 height: 100%;
 
}

.n-avatar .n-avatar__text {

 white-space: nowrap;
 display: inline-block;
 position: absolute;
 left: 50%;
 top: 50%;
 
}

.n-avatar .n-icon {

 vertical-align: bottom;
 font-size: calc(var(--n-merged-size) - 6px);
 
}

.n-avatar .n-avatar__text {
line-height: 1.25
}</style><style cssr-id="n-base-icon">.n-base-icon {

 height: 1em;
 width: 1em;
 line-height: 1em;
 text-align: center;
 display: inline-block;
 position: relative;
 fill: currentColor;
 transform: translateZ(0);

}

.n-base-icon svg {

 height: 1em;
 width: 1em;
 
}</style><style cssr-id="n-modal">.n-modal-container {

 position: fixed;
 left: 0;
 top: 0;
 height: 0;
 width: 0;
 display: flex;
 
}

.n-modal-mask {

 position: fixed;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 background-color: rgba(0, 0, 0, .4);
 
}

.n-modal-mask.fade-in-transition-enter-active {
  transition: all .25s var(--n-bezier-ease-out)!important;
}

.n-modal-mask.fade-in-transition-leave-active {
  transition: all .25s var(--n-bezier-ease-out)!important;
}

.n-modal-mask.fade-in-transition-enter-from, .n-modal-mask.fade-in-transition-leave-to {
  opacity: 0;
}

.n-modal-mask.fade-in-transition-leave-from, .n-modal-mask.fade-in-transition-enter-to {
  opacity: 1;
}

.n-modal-body-wrapper {

 position: fixed;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 overflow: visible;
 
}

.n-modal-body-wrapper .n-modal-scroll-content {

 min-height: 100%;
 display: flex;
 position: relative;
 
}

.n-modal {

 position: relative;
 align-self: center;
 color: var(--n-text-color);
 margin: auto;
 box-shadow: var(--n-box-shadow);
 
}

.n-modal.fade-in-scale-up-transition-leave-active {
  transform-origin: inherit;
  transition: opacity .25s cubic-bezier(.4, 0, 1, 1), transform .25s cubic-bezier(.4, 0, 1, 1) ;
}

.n-modal.fade-in-scale-up-transition-enter-active {
  transform-origin: inherit;
  transition: opacity .25s cubic-bezier(0, 0, .2, 1), transform .25s cubic-bezier(0, 0, .2, 1) ;
}

.n-modal.fade-in-scale-up-transition-enter-from, .n-modal.fade-in-scale-up-transition-leave-to {
  opacity: 0;
  transform:  scale(.5);
}

.n-modal.fade-in-scale-up-transition-leave-from, .n-modal.fade-in-scale-up-transition-enter-to {
  opacity: 1;
  transform:  scale(1);
}</style><style cssr-id="n-auto-complete">.n-auto-complete {

 z-index: auto;
 position: relative;
 display: inline-flex;
 width: 100%;
 
}

.n-auto-complete-menu {

 margin: 4px 0;
 box-shadow: var(--n-menu-box-shadow);
 
}

.n-auto-complete-menu.fade-in-scale-up-transition-leave-active {
  transform-origin: inherit;
  transition: opacity .2s cubic-bezier(.4, 0, 1, 1), transform .2s cubic-bezier(.4, 0, 1, 1) ,background-color .3s var(--n-bezier), box-shadow .3s var(--n-bezier);
}

.n-auto-complete-menu.fade-in-scale-up-transition-enter-active {
  transform-origin: inherit;
  transition: opacity .2s cubic-bezier(0, 0, .2, 1), transform .2s cubic-bezier(0, 0, .2, 1) ,background-color .3s var(--n-bezier), box-shadow .3s var(--n-bezier);
}

.n-auto-complete-menu.fade-in-scale-up-transition-enter-from, .n-auto-complete-menu.fade-in-scale-up-transition-leave-to {
  opacity: 0;
  transform:  scale(.9);
}

.n-auto-complete-menu.fade-in-scale-up-transition-leave-from, .n-auto-complete-menu.fade-in-scale-up-transition-enter-to {
  opacity: 1;
  transform:  scale(1);
}</style><style cssr-id="n-input">.n-input {

 max-width: 100%;
 cursor: text;
 line-height: 1.5;
 z-index: auto;
 outline: none;
 box-sizing: border-box;
 position: relative;
 display: inline-flex;
 border-radius: var(--n-border-radius);
 background-color: var(--n-color);
 transition: background-color .3s var(--n-bezier);
 font-size: var(--n-font-size);
 --n-padding-vertical: calc((var(--n-height) - 1.5 * var(--n-font-size)) / 2);

}

.n-input .n-input__input, .n-input .n-input__textarea {

 overflow: hidden;
 flex-grow: 1;
 position: relative;
 
}

.n-input .n-input__input-el, .n-input .n-input__textarea-el, .n-input .n-input__input-mirror, .n-input .n-input__textarea-mirror, .n-input .n-input__separator, .n-input .n-input__placeholder {

 box-sizing: border-box;
 font-size: inherit;
 line-height: 1.5;
 font-family: inherit;
 border: none;
 outline: none;
 background-color: #0000;
 text-align: inherit;
 transition:
 -webkit-text-fill-color .3s var(--n-bezier),
 caret-color .3s var(--n-bezier),
 color .3s var(--n-bezier),
 text-decoration-color .3s var(--n-bezier);
 
}

.n-input .n-input__input-el, .n-input .n-input__textarea-el {

 -webkit-appearance: none;
 scrollbar-width: none;
 width: 100%;
 min-width: 0;
 text-decoration-color: var(--n-text-decoration-color);
 color: var(--n-text-color);
 caret-color: var(--n-caret-color);
 background-color: transparent;
 
}

.n-input .n-input__input-el::-webkit-scrollbar, .n-input .n-input__textarea-el::-webkit-scrollbar, .n-input .n-input__input-el::-webkit-scrollbar-track-piece, .n-input .n-input__textarea-el::-webkit-scrollbar-track-piece, .n-input .n-input__input-el::-webkit-scrollbar-thumb, .n-input .n-input__textarea-el::-webkit-scrollbar-thumb {

 width: 0;
 height: 0;
 display: none;
 
}

.n-input .n-input__input-el::placeholder, .n-input .n-input__textarea-el::placeholder {

 color: #0000;
 -webkit-text-fill-color: transparent !important;
 
}

.n-input .n-input__input-el:-webkit-autofill ~ .n-input__placeholder, .n-input .n-input__textarea-el:-webkit-autofill ~ .n-input__placeholder {
display: none;
}

.n-input.n-input--round:not(.n-input--textarea) {
border-radius: calc(var(--n-height) / 2);
}

.n-input .n-input__placeholder {

 pointer-events: none;
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 overflow: hidden;
 color: var(--n-placeholder-color);
 
}

.n-input .n-input__placeholder span {

 width: 100%;
 display: inline-block;
 
}

.n-input.n-input--textarea .n-input__placeholder {
overflow: visible;
}

.n-input:not(.n-input--autosize) {
width: 100%;
}

.n-input.n-input--autosize .n-input__textarea-el, .n-input.n-input--autosize .n-input__input-el {

 position: absolute;
 top: 0;
 left: 0;
 height: 100%;
 
}

.n-input .n-input-wrapper {

 overflow: hidden;
 display: inline-flex;
 flex-grow: 1;
 position: relative;
 padding-left: var(--n-padding-left);
 padding-right: var(--n-padding-right);
 
}

.n-input .n-input__input-mirror {

 padding: 0;
 height: var(--n-height);
 line-height: var(--n-height);
 overflow: hidden;
 visibility: hidden;
 position: static;
 white-space: pre;
 pointer-events: none;
 
}

.n-input .n-input__input-el {

 padding: 0;
 height: var(--n-height);
 line-height: var(--n-height);
 
}

.n-input .n-input__input-el + .n-input__placeholder {

 display: flex;
 align-items: center; 
 
}

.n-input:not(.n-input--textarea) .n-input__placeholder {
white-space: nowrap;
}

.n-input .n-input__eye {

 transition: color .3s var(--n-bezier);
 
}

.n-input.n-input--textarea {
width: 100%;
}

.n-input.n-input--textarea .n-input-word-count {

 position: absolute;
 right: var(--n-padding-right);
 bottom: var(--n-padding-vertical);
 
}

.n-input.n-input--textarea.n-input--resizable .n-input-wrapper {

 resize: vertical;
 min-height: var(--n-height);
 
}

.n-input.n-input--textarea .n-input__textarea-el, .n-input.n-input--textarea .n-input__textarea-mirror, .n-input.n-input--textarea .n-input__placeholder {

 height: 100%;
 padding-left: 0;
 padding-right: 0;
 padding-top: var(--n-padding-vertical);
 padding-bottom: var(--n-padding-vertical);
 word-break: break-word;
 display: inline-block;
 vertical-align: bottom;
 box-sizing: border-box;
 line-height: var(--n-line-height-textarea);
 margin: 0;
 resize: none;
 white-space: pre-wrap;
 
}

.n-input.n-input--textarea .n-input__textarea-mirror {

 width: 100%;
 pointer-events: none;
 overflow: hidden;
 visibility: hidden;
 position: static;
 white-space: pre-wrap;
 overflow-wrap: break-word;
 
}

.n-input.n-input--pair .n-input__input-el, .n-input.n-input--pair .n-input__placeholder {
text-align: center;
}

.n-input.n-input--pair .n-input__separator {

 display: flex;
 align-items: center;
 transition: color .3s var(--n-bezier);
 color: var(--n-text-color);
 white-space: nowrap;
 
}

.n-input.n-input--pair .n-input__separator .n-icon {

 color: var(--n-icon-color);
 
}

.n-input.n-input--pair .n-input__separator .n-base-icon {

 color: var(--n-icon-color);
 
}

.n-input.n-input--disabled {

 cursor: not-allowed;
 background-color: var(--n-color-disabled);
 
}

.n-input.n-input--disabled .n-input__border {
border: var(--n-border-disabled);
}

.n-input.n-input--disabled .n-input__input-el, .n-input.n-input--disabled .n-input__textarea-el {

 cursor: not-allowed;
 color: var(--n-text-color-disabled);
 text-decoration-color: var(--n-text-color-disabled);
 
}

.n-input.n-input--disabled .n-input__placeholder {
color: var(--n-placeholder-color-disabled);
}

.n-input.n-input--disabled .n-input__separator {
color: var(--n-text-color-disabled);
}

.n-input.n-input--disabled .n-input__separator .n-icon {

 color: var(--n-icon-color-disabled);
 
}

.n-input.n-input--disabled .n-input__separator .n-base-icon {

 color: var(--n-icon-color-disabled);
 
}

.n-input.n-input--disabled .n-input-word-count {

 color: var(--n-count-text-color-disabled);
 
}

.n-input.n-input--disabled .n-input__suffix, .n-input.n-input--disabled .n-input__prefix {
color: var(--n-text-color-disabled);
}

.n-input.n-input--disabled .n-input__suffix .n-icon, .n-input.n-input--disabled .n-input__prefix .n-icon {

 color: var(--n-icon-color-disabled);
 
}

.n-input.n-input--disabled .n-input__suffix .n-internal-icon, .n-input.n-input--disabled .n-input__prefix .n-internal-icon {

 color: var(--n-icon-color-disabled);
 
}

.n-input:not(.n-input--disabled) .n-input__eye {

 display: flex;
 align-items: center;
 justify-content: center;
 color: var(--n-icon-color);
 cursor: pointer;
 
}

.n-input:not(.n-input--disabled) .n-input__eye:hover {

 color: var(--n-icon-color-hover);
 
}

.n-input:not(.n-input--disabled) .n-input__eye:active {

 color: var(--n-icon-color-pressed);
 
}

.n-input:not(.n-input--disabled):hover .n-input__state-border {
border: var(--n-border-hover);
}

.n-input:not(.n-input--disabled).n-input--focus {
background-color: var(--n-color-focus);
}

.n-input:not(.n-input--disabled).n-input--focus .n-input__state-border {

 border: var(--n-border-focus);
 box-shadow: var(--n-box-shadow-focus);
 
}

.n-input .n-input__border, .n-input .n-input__state-border {

 box-sizing: border-box;
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 pointer-events: none;
 border-radius: inherit;
 border: var(--n-border);
 transition:
 box-shadow .3s var(--n-bezier),
 border-color .3s var(--n-bezier);
 
}

.n-input .n-input__state-border {

 border-color: #0000;
 z-index: 1;
 
}

.n-input .n-input__prefix {
margin-right: 4px;
}

.n-input .n-input__suffix {

 margin-left: 4px;
 
}

.n-input .n-input__suffix, .n-input .n-input__prefix {

 transition: color .3s var(--n-bezier);
 flex-wrap: nowrap;
 flex-shrink: 0;
 line-height: var(--n-height);
 white-space: nowrap;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 color: var(--n-suffix-text-color);
 
}

.n-input .n-input__suffix .n-base-loading, .n-input .n-input__prefix .n-base-loading {

 font-size: var(--n-icon-size);
 margin: 0 2px;
 color: var(--n-loading-color);
 
}

.n-input .n-input__suffix .n-base-clear, .n-input .n-input__prefix .n-base-clear {

 font-size: var(--n-icon-size);
 
}

.n-input .n-input__suffix .n-base-clear .n-base-clear__placeholder .n-base-icon, .n-input .n-input__prefix .n-base-clear .n-base-clear__placeholder .n-base-icon {

 transition: color .3s var(--n-bezier);
 color: var(--n-icon-color);
 font-size: var(--n-icon-size);
 
}

.n-input .n-input__suffix > .n-icon, .n-input .n-input__prefix > .n-icon {

 transition: color .3s var(--n-bezier);
 color: var(--n-icon-color);
 font-size: var(--n-icon-size);
 
}

.n-input .n-input__suffix .n-base-icon, .n-input .n-input__prefix .n-base-icon {

 font-size: var(--n-icon-size);
 
}

.n-input .n-input-word-count {

 pointer-events: none;
 line-height: 1.5;
 font-size: .85em;
 color: var(--n-count-text-color);
 transition: color .3s var(--n-bezier);
 margin-left: 4px;
 font-variant: tabular-nums;
 
}

.n-input.n-input--warning-status:not(.n-input--disabled) .n-base-loading {

 color: var(--n-loading-color-warning)
 
}

.n-input.n-input--warning-status:not(.n-input--disabled) .n-input__input-el, .n-input.n-input--warning-status:not(.n-input--disabled) .n-input__textarea-el {

 caret-color: var(--n-caret-color-warning);
 
}

.n-input.n-input--warning-status:not(.n-input--disabled) .n-input__state-border {

 border: var(--n-border-warning);
 
}

.n-input.n-input--warning-status:not(.n-input--disabled):hover .n-input__state-border {

 border: var(--n-border-hover-warning);
 
}

.n-input.n-input--warning-status:not(.n-input--disabled):focus {

 background-color: var(--n-color-focus-warning);
 
}

.n-input.n-input--warning-status:not(.n-input--disabled):focus .n-input__state-border {

 box-shadow: var(--n-box-shadow-focus-warning);
 border: var(--n-border-focus-warning);
 
}

.n-input.n-input--warning-status:not(.n-input--disabled).n-input--focus {

 background-color: var(--n-color-focus-warning);
 
}

.n-input.n-input--warning-status:not(.n-input--disabled).n-input--focus .n-input__state-border {

 box-shadow: var(--n-box-shadow-focus-warning);
 border: var(--n-border-focus-warning);
 
}

.n-input.n-input--error-status:not(.n-input--disabled) .n-base-loading {

 color: var(--n-loading-color-error)
 
}

.n-input.n-input--error-status:not(.n-input--disabled) .n-input__input-el, .n-input.n-input--error-status:not(.n-input--disabled) .n-input__textarea-el {

 caret-color: var(--n-caret-color-error);
 
}

.n-input.n-input--error-status:not(.n-input--disabled) .n-input__state-border {

 border: var(--n-border-error);
 
}

.n-input.n-input--error-status:not(.n-input--disabled):hover .n-input__state-border {

 border: var(--n-border-hover-error);
 
}

.n-input.n-input--error-status:not(.n-input--disabled):focus {

 background-color: var(--n-color-focus-error);
 
}

.n-input.n-input--error-status:not(.n-input--disabled):focus .n-input__state-border {

 box-shadow: var(--n-box-shadow-focus-error);
 border: var(--n-border-focus-error);
 
}

.n-input.n-input--error-status:not(.n-input--disabled).n-input--focus {

 background-color: var(--n-color-focus-error);
 
}

.n-input.n-input--error-status:not(.n-input--disabled).n-input--focus .n-input__state-border {

 box-shadow: var(--n-box-shadow-focus-error);
 border: var(--n-border-focus-error);
 
}</style><style cssr-id="n-dropdown">.n-dropdown-menu {

 transform-origin: var(--v-transform-origin);
 background-color: var(--n-color);
 border-radius: var(--n-border-radius);
 box-shadow: var(--n-box-shadow);
 position: relative;
 transition:
 background-color .3s var(--n-bezier),
 box-shadow .3s var(--n-bezier);

}

.n-dropdown-menu.fade-in-scale-up-transition-leave-active {
  transform-origin: inherit;
  transition: opacity .2s cubic-bezier(.4, 0, 1, 1), transform .2s cubic-bezier(.4, 0, 1, 1) ;
}

.n-dropdown-menu.fade-in-scale-up-transition-enter-active {
  transform-origin: inherit;
  transition: opacity .2s cubic-bezier(0, 0, .2, 1), transform .2s cubic-bezier(0, 0, .2, 1) ;
}

.n-dropdown-menu.fade-in-scale-up-transition-enter-from, .n-dropdown-menu.fade-in-scale-up-transition-leave-to {
  opacity: 0;
  transform:  scale(.9);
}

.n-dropdown-menu.fade-in-scale-up-transition-leave-from, .n-dropdown-menu.fade-in-scale-up-transition-enter-to {
  opacity: 1;
  transform:  scale(1);
}

.n-dropdown-menu .n-dropdown-option {

 position: relative;
 
}

.n-dropdown-menu .n-dropdown-option a {

 text-decoration: none;
 color: inherit;
 outline: none;
 
}

.n-dropdown-menu .n-dropdown-option a::before {

 content: "";
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body {

 display: flex;
 cursor: pointer;
 position: relative;
 height: var(--n-option-height);
 line-height: var(--n-option-height);
 font-size: var(--n-font-size);
 color: var(--n-option-text-color);
 transition: color .3s var(--n-bezier);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body::before {

 content: "";
 position: absolute;
 top: 0;
 bottom: 0;
 left: 4px;
 right: 4px;
 transition: background-color .3s var(--n-bezier);
 border-radius: var(--n-border-radius);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--pending {

 color: var(--n-option-text-color-hover);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--pending .n-dropdown-option-body__prefix, .n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--pending .n-dropdown-option-body__suffix {

 color: var(--n-option-text-color-hover);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--pending::before {
background-color: var(--n-option-color-hover);
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--active {

 color: var(--n-option-text-color-active);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--active .n-dropdown-option-body__prefix, .n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--active .n-dropdown-option-body__suffix {

 color: var(--n-option-text-color-active);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--active::before {
background-color: var(--n-option-color-active);
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--child-active {

 color: var(--n-option-text-color-child-active);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--child-active .n-dropdown-option-body__prefix, .n-dropdown-menu .n-dropdown-option .n-dropdown-option-body:not(.n-dropdown-option-body--disabled).n-dropdown-option-body--child-active .n-dropdown-option-body__suffix {

 color: var(--n-option-text-color-child-active);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body.n-dropdown-option-body--disabled {

 cursor: not-allowed;
 opacity: var(--n-option-opacity-disabled);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body.n-dropdown-option-body--group {

 font-size: calc(var(--n-font-size) - 1px);
 color: var(--n-group-header-text-color);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body.n-dropdown-option-body--group .n-dropdown-option-body__prefix {

 width: calc(var(--n-option-prefix-width) / 2);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body.n-dropdown-option-body--group .n-dropdown-option-body__prefix.n-dropdown-option-body__prefix--show-icon {

 width: calc(var(--n-option-icon-prefix-width) / 2);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__prefix {

 width: var(--n-option-prefix-width);
 display: flex;
 justify-content: center;
 align-items: center;
 color: var(--n-prefix-color);
 transition: color .3s var(--n-bezier);
 z-index: 1;
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__prefix.n-dropdown-option-body__prefix--show-icon {

 width: var(--n-option-icon-prefix-width);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__prefix .n-icon {

 font-size: var(--n-option-icon-size);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__label {

 white-space: nowrap;
 flex: 1;
 z-index: 1;
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__suffix {

 box-sizing: border-box;
 flex-grow: 0;
 flex-shrink: 0;
 display: flex;
 justify-content: flex-end;
 align-items: center;
 min-width: var(--n-option-suffix-width);
 padding: 0 8px;
 transition: color .3s var(--n-bezier);
 color: var(--n-suffix-color);
 z-index: 1;
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__suffix.n-dropdown-option-body__suffix--has-submenu {

 width: var(--n-option-icon-suffix-width);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-option-body__suffix .n-icon {

 font-size: var(--n-option-icon-size);
 
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-option-body .n-dropdown-menu {
pointer-events: all;
}

.n-dropdown-menu .n-dropdown-option .n-dropdown-offset-container {

 pointer-events: none;
 position: absolute;
 left: 0;
 right: 0;
 top: -4px;
 bottom: -4px;
 
}

.n-dropdown-menu .n-dropdown-divider {

 transition: background-color .3s var(--n-bezier);
 background-color: var(--n-divider-color);
 height: 1px;
 margin: 4px 0;
 
}

.n-dropdown-menu .n-dropdown-menu-wrapper {

 transform-origin: var(--v-transform-origin);
 width: fit-content;
 
}

.n-dropdown-menu > .n-scrollbar {

 height: inherit;
 max-height: inherit;
 
}

.n-dropdown-menu:not(.n-dropdown-menu--scrollable) {

 padding: var(--n-padding);
 
}

.n-dropdown-menu.n-dropdown-menu--scrollable .n-dropdown-menu__content {

 padding: var(--n-padding);
 
}</style><meta name="naive-ui-style"><link rel="modulepreload" as="script" crossorigin="" href="https://chat3.aichatos.xyz/assets/index-492bc328.js"><link rel="stylesheet" href="./index_files/index-a6c9935d.css"></head>
<body class="dark:bg-black">
	<div id="app" data-v-app=""><div class="n-config-provider h-full"><div class="h-full dark:bg-[#24272e] transition-all p-4"><div class="h-full overflow-hidden border rounded-md shadow-md dark:border-neutral-800"><div class="n-layout n-layout--static-positioned z-40 transition h-full pl-[260px]" style="--n-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-color:#fff; --n-text-color:rgb(51, 54, 57);"><div class="n-layout-scroll-container" style="display: flex; flex-flow: row nowrap; width: 100%;"><aside class="n-layout-sider n-layout-sider--absolute-positioned n-layout-sider--left-placement n-layout-sider--bordered n-layout-sider--show-content" style="--n-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-toggle-button-color:#FFF; --n-toggle-button-border:1px solid rgb(239, 239, 245); --n-toggle-bar-color:rgba(191, 191, 191, 1); --n-toggle-bar-color-hover:rgba(153, 153, 153, 1); --n-color:#fff; --n-text-color:rgb(51, 54, 57); --n-border-color:rgb(239, 239, 245); --n-toggle-button-icon-color:rgb(51, 54, 57); max-width: 260px; width: 260px;"><div class="n-layout-sider-scroll-container" style="min-width: 260px; overflow: auto;"><div class="flex flex-col h-full"><main class="flex flex-col flex-1 min-h-0"><div class="p-4"><button class="n-button n-button--default-type n-button--medium-type n-button--block n-button--dashed" tabindex="0" type="button" style="--n-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-bezier-ease-out:cubic-bezier(0, 0, 0.2, 1); --n-ripple-duration:0.6s; --n-opacity-disabled:0.5; --n-wave-opacity:0.6; font-weight: 400; --n-color:#0000; --n-color-hover:#0000; --n-color-pressed:#0000; --n-color-focus:#0000; --n-color-disabled:#0000; --n-ripple-color:#18a058; --n-text-color:rgb(51, 54, 57); --n-text-color-hover:#36ad6a; --n-text-color-pressed:#0c7a43; --n-text-color-focus:#36ad6a; --n-text-color-disabled:rgb(51, 54, 57); --n-border:1px solid rgb(224, 224, 230); --n-border-hover:1px solid #36ad6a; --n-border-pressed:1px solid #0c7a43; --n-border-focus:1px solid #36ad6a; --n-border-disabled:1px solid rgb(224, 224, 230); --n-width: initial; --n-height:34px; --n-font-size:14px; --n-padding:0 14px; --n-icon-size:18px; --n-icon-margin:6px; --n-border-radius:3px;"><!----><!----><span class="n-button__content"> New chat </span><div aria-hidden="true" class="n-base-wave"></div><div aria-hidden="true" class="n-button__border"></div><div aria-hidden="true" class="n-button__state-border"></div></button></div><div class="flex-1 min-h-0 pb-4 overflow-hidden"><div class="px-4 n-scrollbar" role="none" style="--n-scrollbar-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-scrollbar-color:rgba(0, 0, 0, 0.25); --n-scrollbar-color-hover:rgba(0, 0, 0, 0.4); --n-scrollbar-border-radius:5px; --n-scrollbar-width:5px; --n-scrollbar-height:5px;"><div role="none" class="n-scrollbar-container"><div role="none" class="n-scrollbar-content"><div class="flex flex-col gap-2 text-sm"><div><a class="relative flex items-center gap-3 px-3 py-3 break-all border rounded-md cursor-pointer hover:bg-neutral-100 group dark:border-neutral-800 dark:hover:bg-[#24272e] border-[#4b9e5f] bg-neutral-100 text-[#4b9e5f] dark:bg-[#24272e] dark:border-[#4b9e5f] pr-14"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M2 8.994A5.99 5.99 0 0 1 8 3h8c3.313 0 6 2.695 6 5.994V21H8c-3.313 0-6-2.695-6-5.994V8.994ZM20 19V8.994A4.004 4.004 0 0 0 16 5H8a3.99 3.99 0 0 0-4 3.994v6.012A4.004 4.004 0 0 0 8 19h12Zm-6-8h2v2h-2v-2Zm-6 0h2v2H8v-2Z"></path></svg></span><div class="relative flex-1 overflow-hidden break-all text-ellipsis whitespace-nowrap"><span>一、实验目的
1、理解虚拟存储的技术特点。
2、掌握LRU算法的页面置换过程。
二、算法原理
在请求分页存储管理系统中，当发生缺页中断时，操作系统必须在内存中选择一个页面将其换出内存，以便为即将调入的页面腾出空间。如果每次都选择不常使用的页面会提升系统的性能。但如果一个被频繁使用的页面被置换出内存，很可能它在很短时间内又要被调入内存，这会带来不必要的开销。选择调出页面的算法就称为页面置换算法。
LRU是Least Recently Used的缩写，即最近最少使用页面置换算法，是为请求分页存储管理服务的，是根据页面调入内存后的使用情况进行决策。由于无法预测各页面将来的使用情况，只能利用“最近的过去”作为“最近的将来”的近似，因此，LRU算法就是将最近最久未使用的页面予以淘汰。该算法赋予每个页面一个访问字段，用来记录一个页面自上次被访问以来所经历的时间t，当须淘汰一个页面时，选择现有页面中其t值最大的，即最近最少使用的页面予以淘汰。
三、实验内容及要求
1、设计并初始化一个数据结构来描述内存工作区，可选择通过产生随机数的方式得到一个页面序列。
2、系统分配的物理块数由键盘输入或随机产生，随机数的取值范围需加以限制，通常取4~8个物理块。
3、编程实现最近最久使用算法（LRU）算法，程序能够输出正确的页面置换过程、并显示最终的缺页次数及缺页率。　
四、实验过程
1、参考源代码
import java.util.*;
public class LRU {
	private int theArray[];
	private int back; // 定义队尾
	private int currentSize; // 队列中存放元素个数
	private int maxSize = 3; // 队列中能存放元素的个数
	private int count = 0;
	private int sum = 0;
	public LRU() {
		theArray = new int[maxSize];
		back = 0;
		currentSize = 0;
		System.out.println("执行最近最久未使用算法：");
	}
	public void queue(int a[]) {
		for (int i = 0; i &lt; a.length; i++) {
			enQueue(a[i]);
		}
	}
	public void enQueue(int x) { // 入队
		beUsed(x); // 先判断是否已存在该页号，若存在，删除
		if (currentSize &lt; maxSize) {
			// 若队列中有空位，说明不用置换
			theArray[back] = x;
			back++;
			currentSize++;
			this.count++;
		} else if (currentSize == maxSize) { // 若队列中满了，说明要置换
			for (int i = 0; i &lt; maxSize - 1; i++) {
				theArray[i] = theArray[i + 1];
			}
			theArray[maxSize - 1] = x;
			this.count++;
			this.sum++; // 缺页次数+1}
		for (int i = 0; i &lt; currentSize; i++) {
			System.out.print(theArray[i]);
			System.out.print(" ");
		}
		System.out.println();
	}
	public void beUsed(int x) { // 判断是否已存在该页号,若存在，删除已有的
		for (int i = 0; i &lt; currentSize; i++) {
			if (theArray[i] == x) {
				for (int j = i; j &lt; currentSize - 1; j++) {
					theArray[j] = theArray[j + 1];
				}
				currentSize--;
				back--;
			}
		}
	}
	public void queye() {
		System.out.println("页面总序列为：" + this.count);
		System.out.println("置换次数为：" +this.sum);
		System.out.println("缺页次数为：" +(maxSize+this.sum));
		System.out.println("缺页率为：" + (float) (maxSize+this.sum)/ (float) this.count * 100 + "%");}
	public static void main(String[] args) {
		LRU lru = new LRU();
		int a[] = { 4, 3, 0, 4, 1, 6, 4, 2, 1, 1, 0, 3, 1, 0, 4, 2, 6, 4, 1, 3, 4, 2, 0, 4 };
		lru.queue(a);
		lru.queye();
	}
}

2、程序调试
 
五、实验总结及扩展
1、根据程序运行结果，结合其他页面置换算法，分析影响缺页率的因素。
2、修改程序，完成下题的计算，运行结果截图放在实验报告的总结中。
在一个请求分页系统中，假如一个作业的页面序号走向为 4,  3,  2,  1,  4,  3,  5,  4,  3,  2,  1,  5，3，1，2，4。目前还没有任何页装入内存，当分配给该作业的物理块数目 M 为3和4 时，计算采用 LRU 页面淘汰算法时访问过程中所发生的缺页次数和缺页率 ？
</span></div><div class="absolute z-10 flex visible right-1"><button class="p-1"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M6.414 15.89L16.556 5.748l-1.414-1.414L5 14.476v1.414h1.414Zm.829 2H3v-4.243L14.435 2.212a1 1 0 0 1 1.414 0l2.829 2.829a1 1 0 0 1 0 1.414L7.243 17.89ZM3 19.89h18v2H3v-2Z"></path></svg></button><!----><button class="p-1"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M17 6h5v2h-2v13a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V8H2V6h5V3a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v3Zm1 2H6v12h12V8Zm-9 3h2v6H9v-6Zm4 0h2v6h-2v-6ZM9 4v2h6V4H9Z"></path></svg></button><!----></div></a></div><div><a class="relative flex items-center gap-3 px-3 py-3 break-all border rounded-md cursor-pointer hover:bg-neutral-100 group dark:border-neutral-800 dark:hover:bg-[#24272e]"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M2 8.994A5.99 5.99 0 0 1 8 3h8c3.313 0 6 2.695 6 5.994V21H8c-3.313 0-6-2.695-6-5.994V8.994ZM20 19V8.994A4.004 4.004 0 0 0 16 5H8a3.99 3.99 0 0 0-4 3.994v6.012A4.004 4.004 0 0 0 8 19h12Zm-6-8h2v2h-2v-2Zm-6 0h2v2H8v-2Z"></path></svg></span><div class="relative flex-1 overflow-hidden break-all text-ellipsis whitespace-nowrap"><span>New Chat</span></div><!----></a></div></div></div></div><div class="n-scrollbar-rail n-scrollbar-rail--vertical n-scrollbar-rail--disabled" data-scrollbar-rail="true" aria-hidden="true"><!----></div><!----></div></div><div class="p-4"><button class="n-button n-button--default-type n-button--medium-type n-button--block" tabindex="0" type="button" style="--n-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-bezier-ease-out:cubic-bezier(0, 0, 0.2, 1); --n-ripple-duration:0.6s; --n-opacity-disabled:0.5; --n-wave-opacity:0.6; font-weight: 400; --n-color:#0000; --n-color-hover:#0000; --n-color-pressed:#0000; --n-color-focus:#0000; --n-color-disabled:#0000; --n-ripple-color:#18a058; --n-text-color:rgb(51, 54, 57); --n-text-color-hover:#36ad6a; --n-text-color-pressed:#0c7a43; --n-text-color-focus:#36ad6a; --n-text-color-disabled:rgb(51, 54, 57); --n-border:1px solid rgb(224, 224, 230); --n-border-hover:1px solid #36ad6a; --n-border-pressed:1px solid #0c7a43; --n-border-focus:1px solid #36ad6a; --n-border-disabled:1px solid rgb(224, 224, 230); --n-width: initial; --n-height:34px; --n-font-size:14px; --n-padding:0 14px; --n-icon-size:18px; --n-icon-margin:6px; --n-border-radius:3px;"><!----><!----><span class="n-button__content"> Prompt Store </span><div aria-hidden="true" class="n-base-wave"></div><div aria-hidden="true" class="n-button__border"></div><div aria-hidden="true" class="n-button__state-border"></div></button></div></main><footer class="flex items-center justify-between min-w-0 p-4 overflow-hidden border-t dark:border-neutral-800"><div class="flex-1 flex-shrink-0 overflow-hidden"><div class="flex items-center overflow-hidden"><div class="w-10 h-10 overflow-hidden rounded-full shrink-0"><span class="n-avatar" style="--n-font-size:14px; --n-border:none; --n-border-radius:50%; --n-color:rgba(204, 204, 204, 1); --n-color-modal:rgba(204, 204, 204, 1); --n-color-popover:rgba(204, 204, 204, 1); --n-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-merged-size:var(--n-avatar-size-override, 40px);"><img src="./index_files/avatar-ceeb03f6.jpg"><!----></span></div><div class="flex-1 min-w-0 ml-2"><h2 class="overflow-hidden font-bold text-md text-ellipsis whitespace-nowrap">Anonymous</h2><p class="overflow-hidden text-xs text-gray-500 text-ellipsis whitespace-nowrap"><span>Star on <a href="https://github.com/binjie09" class="text-blue-500" target="_blank">Github</a></span></p></div></div></div><div><!----><button class="flex items-center justify-center w-10 h-10 transition rounded-full hover:bg-neutral-100 dark:hover:bg-[#414755]"><span class="text-xl text-[#4f555e] dark:text-white"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M2 12c0-.865.11-1.704.316-2.504A3 3 0 0 0 4.99 4.867a9.99 9.99 0 0 1 4.335-2.506a3 3 0 0 0 5.348 0a9.99 9.99 0 0 1 4.335 2.506a3 3 0 0 0 2.675 4.63c.206.8.316 1.638.316 2.503c0 .864-.11 1.703-.316 2.503a3 3 0 0 0-2.675 4.63a9.99 9.99 0 0 1-4.335 2.505a3 3 0 0 0-5.348 0a9.99 9.99 0 0 1-4.335-2.505a3 3 0 0 0-2.675-4.63C2.11 13.703 2 12.864 2 12Zm4.804 3c.63 1.091.81 2.346.564 3.524c.408.29.842.541 1.297.75A4.993 4.993 0 0 1 12 18c1.26 0 2.438.471 3.335 1.274c.455-.209.889-.46 1.297-.75A4.993 4.993 0 0 1 17.196 15a4.993 4.993 0 0 1 2.77-2.25a8.142 8.142 0 0 0 0-1.5A4.993 4.993 0 0 1 17.195 9a4.993 4.993 0 0 1-.564-3.524a7.991 7.991 0 0 0-1.297-.75A4.993 4.993 0 0 1 12 6a4.993 4.993 0 0 1-3.335-1.274a7.99 7.99 0 0 0-1.297.75A4.993 4.993 0 0 1 6.804 9a4.993 4.993 0 0 1-2.77 2.25a8.125 8.125 0 0 0 0 1.5A4.993 4.993 0 0 1 6.805 15ZM12 15a3 3 0 1 1 0-6a3 3 0 0 1 0 6Zm0-2a1 1 0 1 0 0-2a1 1 0 0 0 0 2Z"></path></svg></span></button><!----></div><!----></footer></div></div><div class="n-layout-toggle-button"><i class="n-base-icon"><svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.64645 3.14645C5.45118 3.34171 5.45118 3.65829 5.64645 3.85355L9.79289 8L5.64645 12.1464C5.45118 12.3417 5.45118 12.6583 5.64645 12.8536C5.84171 13.0488 6.15829 13.0488 6.35355 12.8536L10.8536 8.35355C11.0488 8.15829 11.0488 7.84171 10.8536 7.64645L6.35355 3.14645C6.15829 2.95118 5.84171 2.95118 5.64645 3.14645Z" fill="currentColor"></path></svg></i></div><div class="n-layout-sider__border"></div></aside><!----><!----><!----><!----><div class="n-layout-content n-layout n-layout--static-positioned h-full" style="--n-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-color:#fff; --n-text-color:rgb(51, 54, 57);"><div class="n-layout-scroll-container"><div class="flex flex-col w-full h-full"><!----><main class="flex-1 overflow-hidden"><div id="scrollRef" class="h-full overflow-hidden overflow-y-auto"><div id="image-wrapper" class="w-full max-w-screen-xl m-auto dark:bg-[#101014] p-4"><div class="flex w-full mb-6 overflow-hidden flex-row-reverse"><div class="flex items-center justify-center flex-shrink-0 h-8 overflow-hidden rounded-full basis-8 ml-2"><span class="n-avatar" style="--n-font-size:14px; --n-border:none; --n-border-radius:3px; --n-color:rgba(204, 204, 204, 1); --n-color-modal:rgba(204, 204, 204, 1); --n-color-popover:rgba(204, 204, 204, 1); --n-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-merged-size:var(--n-avatar-size-override, 34px);"><img src="./index_files/avatar-ceeb03f6.jpg"><!----></span></div><div class="overflow-hidden text-sm items-end"><p class="text-xs text-[#b4bbc4] text-right">2023/5/18 14:37:58</p><div class="flex items-end gap-1 mt-2 flex-row-reverse"><div class="text-black text-wrap min-w-[20px] rounded-md px-3 py-2 bg-[#d2f9d1] dark:bg-[#a1dc95]"><div class="leading-relaxed break-words"><div class="whitespace-pre-wrap">一、实验目的
1、理解虚拟存储的技术特点。
2、掌握LRU算法的页面置换过程。
二、算法原理
在请求分页存储管理系统中，当发生缺页中断时，操作系统必须在内存中选择一个页面将其换出内存，以便为即将调入的页面腾出空间。如果每次都选择不常使用的页面会提升系统的性能。但如果一个被频繁使用的页面被置换出内存，很可能它在很短时间内又要被调入内存，这会带来不必要的开销。选择调出页面的算法就称为页面置换算法。
LRU是Least Recently Used的缩写，即最近最少使用页面置换算法，是为请求分页存储管理服务的，是根据页面调入内存后的使用情况进行决策。由于无法预测各页面将来的使用情况，只能利用“最近的过去”作为“最近的将来”的近似，因此，LRU算法就是将最近最久未使用的页面予以淘汰。该算法赋予每个页面一个访问字段，用来记录一个页面自上次被访问以来所经历的时间t，当须淘汰一个页面时，选择现有页面中其t值最大的，即最近最少使用的页面予以淘汰。
三、实验内容及要求
1、设计并初始化一个数据结构来描述内存工作区，可选择通过产生随机数的方式得到一个页面序列。
2、系统分配的物理块数由键盘输入或随机产生，随机数的取值范围需加以限制，通常取4~8个物理块。
3、编程实现最近最久使用算法（LRU）算法，程序能够输出正确的页面置换过程、并显示最终的缺页次数及缺页率。　
四、实验过程
1、参考源代码
import java.util.*;
public class LRU {
	private int theArray[];
	private int back; // 定义队尾
	private int currentSize; // 队列中存放元素个数
	private int maxSize = 3; // 队列中能存放元素的个数
	private int count = 0;
	private int sum = 0;
	public LRU() {
		theArray = new int[maxSize];
		back = 0;
		currentSize = 0;
		System.out.println("执行最近最久未使用算法：");
	}
	public void queue(int a[]) {
		for (int i = 0; i &lt; a.length; i++) {
			enQueue(a[i]);
		}
	}
	public void enQueue(int x) { // 入队
		beUsed(x); // 先判断是否已存在该页号，若存在，删除
		if (currentSize &lt; maxSize) {
			// 若队列中有空位，说明不用置换
			theArray[back] = x;
			back++;
			currentSize++;
			this.count++;
		} else if (currentSize == maxSize) { // 若队列中满了，说明要置换
			for (int i = 0; i &lt; maxSize - 1; i++) {
				theArray[i] = theArray[i + 1];
			}
			theArray[maxSize - 1] = x;
			this.count++;
			this.sum++; // 缺页次数+1}
		for (int i = 0; i &lt; currentSize; i++) {
			System.out.print(theArray[i]);
			System.out.print(" ");
		}
		System.out.println();
	}
	public void beUsed(int x) { // 判断是否已存在该页号,若存在，删除已有的
		for (int i = 0; i &lt; currentSize; i++) {
			if (theArray[i] == x) {
				for (int j = i; j &lt; currentSize - 1; j++) {
					theArray[j] = theArray[j + 1];
				}
				currentSize--;
				back--;
			}
		}
	}
	public void queye() {
		System.out.println("页面总序列为：" + this.count);
		System.out.println("置换次数为：" +this.sum);
		System.out.println("缺页次数为：" +(maxSize+this.sum));
		System.out.println("缺页率为：" + (float) (maxSize+this.sum)/ (float) this.count * 100 + "%");}
	public static void main(String[] args) {
		LRU lru = new LRU();
		int a[] = { 4, 3, 0, 4, 1, 6, 4, 2, 1, 1, 0, 3, 1, 0, 4, 2, 6, 4, 1, 3, 4, 2, 0, 4 };
		lru.queue(a);
		lru.queye();
	}
}

2、程序调试
 
五、实验总结及扩展
1、根据程序运行结果，结合其他页面置换算法，分析影响缺页率的因素。
2、修改程序，完成下题的计算，运行结果截图放在实验报告的总结中。
在一个请求分页系统中，假如一个作业的页面序号走向为 4,  3,  2,  1,  4,  3,  5,  4,  3,  2,  1,  5，3，1，2，4。目前还没有任何页装入内存，当分配给该作业的物理块数目 M 为3和4 时，计算采用 LRU 页面淘汰算法时访问过程中所发生的缺页次数和缺页率 ？
</div></div></div><div class="flex flex-col"><!----><!----><button class="transition text-neutral-300 hover:text-neutral-800 dark:hover:text-neutral-200"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 3c-1.1 0-2 .9-2 2s.9 2 2 2s2-.9 2-2s-.9-2-2-2Zm0 14c-1.1 0-2 .9-2 2s.9 2 2 2s2-.9 2-2s-.9-2-2-2Zm0-7c-1.1 0-2 .9-2 2s.9 2 2 2s2-.9 2-2s-.9-2-2-2Z"></path></svg></button><!----></div></div></div></div><div class="flex w-full mb-6 overflow-hidden"><div class="flex items-center justify-center flex-shrink-0 h-8 overflow-hidden rounded-full basis-8 mr-2"><span class="text-[28px] dark:text-white"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" aria-hidden="true" width="1em" height="1em"><path d="M29.71,13.09A8.09,8.09,0,0,0,20.34,2.68a8.08,8.08,0,0,0-13.7,2.9A8.08,8.08,0,0,0,2.3,18.9,8,8,0,0,0,3,25.45a8.08,8.08,0,0,0,8.69,3.87,8,8,0,0,0,6,2.68,8.09,8.09,0,0,0,7.7-5.61,8,8,0,0,0,5.33-3.86A8.09,8.09,0,0,0,29.71,13.09Zm-12,16.82a6,6,0,0,1-3.84-1.39l.19-.11,6.37-3.68a1,1,0,0,0,.53-.91v-9l2.69,1.56a.08.08,0,0,1,.05.07v7.44A6,6,0,0,1,17.68,29.91ZM4.8,24.41a6,6,0,0,1-.71-4l.19.11,6.37,3.68a1,1,0,0,0,1,0l7.79-4.49V22.8a.09.09,0,0,1,0,.08L13,26.6A6,6,0,0,1,4.8,24.41ZM3.12,10.53A6,6,0,0,1,6.28,7.9v7.57a1,1,0,0,0,.51.9l7.75,4.47L11.85,22.4a.14.14,0,0,1-.09,0L5.32,18.68a6,6,0,0,1-2.2-8.18Zm22.13,5.14-7.78-4.52L20.16,9.6a.08.08,0,0,1,.09,0l6.44,3.72a6,6,0,0,1-.9,10.81V16.56A1.06,1.06,0,0,0,25.25,15.67Zm2.68-4-.19-.12-6.36-3.7a1,1,0,0,0-1.05,0l-7.78,4.49V9.2a.09.09,0,0,1,0-.09L19,5.4a6,6,0,0,1,8.91,6.21ZM11.08,17.15,8.38,15.6a.14.14,0,0,1-.05-.08V8.1a6,6,0,0,1,9.84-4.61L18,3.6,11.61,7.28a1,1,0,0,0-.53.91ZM12.54,14,16,12l3.47,2v4L16,20l-3.47-2Z" fill="currentColor"></path></svg></span></div><div class="overflow-hidden text-sm items-start"><p class="text-xs text-[#b4bbc4] text-left">2023/5/18 14:40:58</p><div class="flex items-end gap-1 mt-2 flex-row"><div class="text-black text-wrap min-w-[20px] rounded-md px-3 py-2 bg-[#f4f6f8] dark:bg-[#1e1e20]"><div class="leading-relaxed break-words"><div class="markdown-body"><p>根据实验程序，可以修改代码进行计算：</p>
<p>物理块数 M = 3 时：</p>
<pre class="code-block-wrapper"><div class="code-block-header"><span class="code-block-header__lang"></span><span class="code-block-header__copy">Copy Code</span></div><code class="hljs code-block-body "><span class="hljs-keyword">import</span> java.util.*;
<span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">LRU</span> {
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> theArray[];
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> back; <span class="hljs-comment">// 定义队尾</span>
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> currentSize; <span class="hljs-comment">// 队列中存放元素个数</span>
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> <span class="hljs-variable">maxSize</span> <span class="hljs-operator">=</span> <span class="hljs-number">3</span>; <span class="hljs-comment">// 队列中能存放元素的个数</span>
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> <span class="hljs-variable">count</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>;
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> <span class="hljs-variable">sum</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>;
    <span class="hljs-keyword">public</span> <span class="hljs-title function_">LRU</span><span class="hljs-params">()</span> {
        theArray = <span class="hljs-keyword">new</span> <span class="hljs-title class_">int</span>[maxSize];
        back = <span class="hljs-number">0</span>;
        currentSize = <span class="hljs-number">0</span>;
        System.out.println(<span class="hljs-string">"执行最近最久未使用算法："</span>);
    }
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">queue</span><span class="hljs-params">(<span class="hljs-type">int</span> a[])</span> {
        <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">i</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>; i &lt; a.length; i++) {
            enQueue(a[i]);
        }
    }
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">enQueue</span><span class="hljs-params">(<span class="hljs-type">int</span> x)</span> { <span class="hljs-comment">// 入队</span>
        beUsed(x); <span class="hljs-comment">// 先判断是否已存在该页号，若存在，删除</span>
        <span class="hljs-keyword">if</span> (currentSize &lt; maxSize) {
            <span class="hljs-comment">// 若队列中有空位，说明不用置换</span>
            theArray[back] = x;
            back++;
            currentSize++;
            <span class="hljs-built_in">this</span>.count++;
        } <span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span> (currentSize == maxSize) { <span class="hljs-comment">// 若队列中满了，说明要置换</span>
            <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">i</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>; i &lt; maxSize - <span class="hljs-number">1</span>; i++) {
                theArray[i] = theArray[i + <span class="hljs-number">1</span>];
            }
            theArray[maxSize - <span class="hljs-number">1</span>] = x;
            <span class="hljs-built_in">this</span>.count++;
            <span class="hljs-built_in">this</span>.sum++; <span class="hljs-comment">// 缺页次数+1</span>
        }
        <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">i</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>; i &lt; currentSize; i++) {
            System.out.print(theArray[i]);
            System.out.print(<span class="hljs-string">" "</span>);
        }
        System.out.println();
    }
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">beUsed</span><span class="hljs-params">(<span class="hljs-type">int</span> x)</span> { <span class="hljs-comment">// 判断是否已存在该页号,若存在，删除已有的</span>
        <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">i</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>; i &lt; currentSize; i++) {
            <span class="hljs-keyword">if</span> (theArray[i] == x) {
                <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">j</span> <span class="hljs-operator">=</span> i; j &lt; currentSize - <span class="hljs-number">1</span>; j++) {
                    theArray[j] = theArray[j + <span class="hljs-number">1</span>];
                }
                currentSize--;
                back--;
            }
        }
    }
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">queye</span><span class="hljs-params">()</span> {
        System.out.println(<span class="hljs-string">"物理块数 M = "</span>+maxSize+<span class="hljs-string">" 时："</span>);
        System.out.println(<span class="hljs-string">"页面总序列为："</span> + <span class="hljs-built_in">this</span>.count);
        System.out.println(<span class="hljs-string">"置换次数为："</span> +<span class="hljs-built_in">this</span>.sum);
        System.out.println(<span class="hljs-string">"缺页次数为："</span> +(maxSize+<span class="hljs-built_in">this</span>.sum));
        System.out.println(<span class="hljs-string">"缺页率为："</span> + (<span class="hljs-type">float</span>) (maxSize+<span class="hljs-built_in">this</span>.sum)/ (<span class="hljs-type">float</span>) <span class="hljs-built_in">this</span>.count * <span class="hljs-number">100</span> + <span class="hljs-string">"%"</span>);}
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">static</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">main</span><span class="hljs-params">(String[] args)</span> {
        <span class="hljs-type">LRU</span> <span class="hljs-variable">lru</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">LRU</span>();
        <span class="hljs-type">int</span> a[] = { <span class="hljs-number">4</span>, <span class="hljs-number">3</span>, <span class="hljs-number">2</span>, <span class="hljs-number">1</span>, <span class="hljs-number">4</span>, <span class="hljs-number">3</span>, <span class="hljs-number">5</span>, <span class="hljs-number">4</span>, <span class="hljs-number">3</span>, <span class="hljs-number">2</span>, <span class="hljs-number">1</span>, <span class="hljs-number">5</span>, <span class="hljs-number">3</span>, <span class="hljs-number">1</span>, <span class="hljs-number">2</span>, <span class="hljs-number">4</span> };
        lru.queue(a);
        lru.queye();
    }
}
</code></pre>
<p>运行结果如下：</p>
<pre class="code-block-wrapper"><div class="code-block-header"><span class="code-block-header__lang"></span><span class="code-block-header__copy">Copy Code</span></div><code class="hljs code-block-body ">执行最近最久未使用算法：
4 
4<span class="hljs-number"> 3 </span>
4<span class="hljs-number"> 3 </span>2 
4<span class="hljs-number"> 3 </span>2<span class="hljs-number"> 1 </span>
3<span class="hljs-number"> 2 </span>1 
3<span class="hljs-number"> 2 </span>1<span class="hljs-number"> 4 </span>
5<span class="hljs-number"> 1 </span>4 
5<span class="hljs-number"> 3 </span>4 
2<span class="hljs-number"> 3 </span>4 
1<span class="hljs-number"> 3 </span>4 
5<span class="hljs-number"> 3 </span>4 
5<span class="hljs-number"> 3 </span>1 
5<span class="hljs-number"> 2 </span>1 
4<span class="hljs-number"> 2 </span>1 
缺页次数为：13
缺页率为：81.25%
</code></pre>
<p>物理块数 M = 4 时：</p>
<pre class="code-block-wrapper"><div class="code-block-header"><span class="code-block-header__lang"></span><span class="code-block-header__copy">Copy Code</span></div><code class="hljs code-block-body "><span class="hljs-keyword">import</span> java.util.*;
<span class="hljs-keyword">public</span> <span class="hljs-keyword">class</span> <span class="hljs-title class_">LRU</span> {
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> theArray[];
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> back; <span class="hljs-comment">// 定义队尾</span>
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> currentSize; <span class="hljs-comment">// 队列中存放元素个数</span>
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> <span class="hljs-variable">maxSize</span> <span class="hljs-operator">=</span> <span class="hljs-number">4</span>; <span class="hljs-comment">// 队列中能存放元素的个数</span>
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> <span class="hljs-variable">count</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>;
    <span class="hljs-keyword">private</span> <span class="hljs-type">int</span> <span class="hljs-variable">sum</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>;
    <span class="hljs-keyword">public</span> <span class="hljs-title function_">LRU</span><span class="hljs-params">()</span> {
        theArray = <span class="hljs-keyword">new</span> <span class="hljs-title class_">int</span>[maxSize];
        back = <span class="hljs-number">0</span>;
        currentSize = <span class="hljs-number">0</span>;
        System.out.println(<span class="hljs-string">"执行最近最久未使用算法："</span>);
    }
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">queue</span><span class="hljs-params">(<span class="hljs-type">int</span> a[])</span> {
        <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">i</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>; i &lt; a.length; i++) {
            enQueue(a[i]);
        }
    }
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">enQueue</span><span class="hljs-params">(<span class="hljs-type">int</span> x)</span> { <span class="hljs-comment">// 入队</span>
        beUsed(x); <span class="hljs-comment">// 先判断是否已存在该页号，若存在，删除</span>
        <span class="hljs-keyword">if</span> (currentSize &lt; maxSize) {
            <span class="hljs-comment">// 若队列中有空位，说明不用置换</span>
            theArray[back] = x;
            back++;
            currentSize++;
            <span class="hljs-built_in">this</span>.count++;
        } <span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span> (currentSize == maxSize) { <span class="hljs-comment">// 若队列中满了，说明要置换</span>
            <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">i</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>; i &lt; maxSize - <span class="hljs-number">1</span>; i++) {
                theArray[i] = theArray[i + <span class="hljs-number">1</span>];
            }
            theArray[maxSize - <span class="hljs-number">1</span>] = x;
            <span class="hljs-built_in">this</span>.count++;
            <span class="hljs-built_in">this</span>.sum++; <span class="hljs-comment">// 缺页次数+1</span>
        }
        <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">i</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>; i &lt; currentSize; i++) {
            System.out.print(theArray[i]);
            System.out.print(<span class="hljs-string">" "</span>);
        }
        System.out.println();
    }
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">beUsed</span><span class="hljs-params">(<span class="hljs-type">int</span> x)</span> { <span class="hljs-comment">// 判断是否已存在该页号,若存在，删除已有的</span>
        <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">i</span> <span class="hljs-operator">=</span> <span class="hljs-number">0</span>; i &lt; currentSize; i++) {
            <span class="hljs-keyword">if</span> (theArray[i] == x) {
                <span class="hljs-keyword">for</span> (<span class="hljs-type">int</span> <span class="hljs-variable">j</span> <span class="hljs-operator">=</span> i; j &lt; currentSize - <span class="hljs-number">1</span>; j++) {
                    theArray[j] = theArray[j + <span class="hljs-number">1</span>];
                }
                currentSize--;
                back--;
            }
        }
    }
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">queye</span><span class="hljs-params">()</span> {
        System.out.println(<span class="hljs-string">"物理块数 M = "</span>+maxSize+<span class="hljs-string">" 时："</span>);
        System.out.println(<span class="hljs-string">"页面总序列为："</span> + <span class="hljs-built_in">this</span>.count);
        System.out.println(<span class="hljs-string">"置换次数为："</span> +<span class="hljs-built_in">this</span>.sum);
        System.out.println(<span class="hljs-string">"缺页次数为："</span> +(maxSize+<span class="hljs-built_in">this</span>.sum));
        System.out.println(<span class="hljs-string">"缺页率为："</span> + (<span class="hljs-type">float</span>) (maxSize+<span class="hljs-built_in">this</span>.sum)/ (<span class="hljs-type">float</span>) <span class="hljs-built_in">this</span>.count * <span class="hljs-number">100</span> + <span class="hljs-string">"%"</span>);}
    <span class="hljs-keyword">public</span> <span class="hljs-keyword">static</span> <span class="hljs-keyword">void</span> <span class="hljs-title function_">main</span><span class="hljs-params">(String[] args)</span> {
        <span class="hljs-type">LRU</span> <span class="hljs-variable">lru</span> <span class="hljs-operator">=</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">LRU</span>();
        <span class="hljs-type">int</span> a[] = { <span class="hljs-number">4</span>, <span class="hljs-number">3</span>, <span class="hljs-number">2</span>, <span class="hljs-number">1</span>, <span class="hljs-number">4</span>, <span class="hljs-number">3</span>, <span class="hljs-number">5</span>, <span class="hljs-number">4</span>, <span class="hljs-number">3</span>, <span class="hljs-number">2</span>, <span class="hljs-number">1</span>, <span class="hljs-number">5</span>, <span class="hljs-number">3</span>, <span class="hljs-number">1</span>, <span class="hljs-number">2</span>, <span class="hljs-number">4</span> };
        lru.queue(a);
        lru.queye();
    }
}
</code></pre>
<p>运行结果如下：</p>
<pre class="code-block-wrapper"><div class="code-block-header"><span class="code-block-header__lang"></span><span class="code-block-header__copy">Copy Code</span></div><code class="hljs code-block-body ">执行最近最久未使用算法：
4 
4<span class="hljs-number"> 3 </span>
4<span class="hljs-number"> 3 </span>2 
4<span class="hljs-number"> 3 </span>2<span class="hljs-number"> 1 </span>
3<span class="hljs-number"> 2 </span>1 
5<span class="hljs-number"> 3 </span>2<span class="hljs-number"> 1 </span>
4<span class="hljs-number"> 5 </span>3<span class="hljs-number"> 2 </span>
4<span class="hljs-number"> 3 </span>5<span class="hljs-number"> 2 </span>
4<span class="hljs-number"> 3 </span>2<span class="hljs-number"> 5 </span>
1<span class="hljs-number"> 3 </span>2<span class="hljs-number"> 5 </span>
1<span class="hljs-number"> 5 </span>2<span class="hljs-number"> 4 </span>
3<span class="hljs-number"> 5 </span>2<span class="hljs-number"> 1 </span>
1<span class="hljs-number"> 2 </span>3<span class="hljs-number"> 5 </span>
4<span class="hljs-number"> 2 </span>3<span class="hljs-number"> 1 </span>
1<span class="hljs-number"> 4 </span>2<span class="hljs-number"> 3 </span>
缺页次数为：10
缺页率为：62.5%
</code></pre>
<p>通过计算得知，当物理块数 M = 3 时，访问过程中所发生的缺页次数为 13，缺页率为 81.25%；当物理块数 M = 4 时，访问过程中所发生的缺页次数为 10，缺页率为 62.5%。由此可见，在相同的页面序列走向下，增加物理块数可以有效降低缺页率。同时，也可以看出，LRU算法能够有效地利用历史信息，提高访问性能。</p>
</div></div></div><div class="flex flex-col"><button class="mb-2 transition text-neutral-300 hover:text-neutral-800 dark:hover:text-neutral-300"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M18.537 19.567A9.961 9.961 0 0 1 12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10c0 2.136-.67 4.116-1.81 5.74L17 12h3a8 8 0 1 0-2.46 5.772l.997 1.795Z"></path></svg></button><!----><button class="transition text-neutral-300 hover:text-neutral-800 dark:hover:text-neutral-200"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 3c-1.1 0-2 .9-2 2s.9 2 2 2s2-.9 2-2s-.9-2-2-2Zm0 14c-1.1 0-2 .9-2 2s.9 2 2 2s2-.9 2-2s-.9-2-2-2Zm0-7c-1.1 0-2 .9-2 2s.9 2 2 2s2-.9 2-2s-.9-2-2-2Z"></path></svg></button><!----></div></div></div></div><div class="sticky bottom-0 left-0 flex justify-center"><!----></div></div></div></main><footer class="p-4"><div class="flex items-center justify-between space-x-2"><div><!----><button class="flex items-center justify-center w-10 h-10 transition rounded-full hover:bg-neutral-100 dark:hover:bg-[#414755]"><span class="text-xl dark:text-white text-[#2979ff]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--mdi" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M16.5 12c0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2c0 .37-.03.73-.08 1.08c.69.1 1.33.32 1.92.64c.1-.56.16-1.13.16-1.72c0-5.5-4.5-10-10-10C6.47 2 2 6.5 2 12s4.5 10 10 10c.59 0 1.16-.06 1.72-.16A5.9 5.9 0 0 1 13 19c0-.29.03-.57.07-.85c-.32.63-.67 1.24-1.07 1.81c-.83-1.2-1.5-2.53-1.91-3.96h3.72a5.95 5.95 0 0 1 2.59-2.4c.06-.53.1-1.06.1-1.6M12 4.03c.83 1.2 1.5 2.54 1.91 3.97h-3.82c.41-1.43 1.08-2.77 1.91-3.97M4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2s.06 1.34.14 2H4.26m.82 2H8c.35 1.25.8 2.45 1.4 3.56A8.008 8.008 0 0 1 5.08 16M8 8H5.08A7.923 7.923 0 0 1 9.4 4.44C8.8 5.55 8.35 6.75 8 8m6.34 6H9.66c-.1-.66-.16-1.32-.16-2s.06-1.35.16-2h4.68c.09.65.16 1.32.16 2s-.07 1.34-.16 2m.25-9.56c1.84.63 3.37 1.9 4.33 3.56h-2.95a15.65 15.65 0 0 0-1.38-3.56m7.91 12.81L17.75 22L15 19l1.16-1.16l1.59 1.59l3.59-3.59l1.16 1.41Z"></path></svg><!----></span></button><!----></div><div><!----><button class="flex items-center justify-center w-10 h-10 transition rounded-full hover:bg-neutral-100 dark:hover:bg-[#414755]"><span class="text-xl text-[#4b9e5f] dark:text-white"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ph" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M216 72h-35.08c.39-.33.79-.65 1.17-1A29.53 29.53 0 0 0 192 49.57A32.62 32.62 0 0 0 158.44 16A29.53 29.53 0 0 0 137 25.91a54.94 54.94 0 0 0-9 14.48a54.94 54.94 0 0 0-9-14.48A29.53 29.53 0 0 0 97.56 16A32.62 32.62 0 0 0 64 49.57A29.53 29.53 0 0 0 73.91 71c.38.33.78.65 1.17 1H40a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16v64a16 16 0 0 0 16 16h60a4 4 0 0 0 4-4v-92H40V88h80v32h16V88h80v32h-80v92a4 4 0 0 0 4 4h60a16 16 0 0 0 16-16v-64a16 16 0 0 0 16-16V88a16 16 0 0 0-16-16ZM84.51 59a13.69 13.69 0 0 1-4.5-10a16.62 16.62 0 0 1 16.58-17h.49a13.69 13.69 0 0 1 10 4.5c8.39 9.48 11.35 25.2 12.39 34.92C109.71 70.39 94 67.43 84.51 59Zm87 0c-9.49 8.4-25.24 11.36-35 12.4C137.7 60.89 141 45.5 149 36.51a13.69 13.69 0 0 1 10-4.5h.49A16.62 16.62 0 0 1 176 49.08a13.69 13.69 0 0 1-4.51 9.92Z"></path></svg></span></button></div><div class="n-auto-complete"><div class="n-input n-input--textarea n-input--autosize n-input--stateful" style="--n-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-count-text-color:rgb(118, 124, 130); --n-count-text-color-disabled:rgba(194, 194, 194, 1); --n-color:rgba(255, 255, 255, 1); --n-font-size:14px; --n-border-radius:3px; --n-height:34px; --n-padding-left:12px; --n-padding-right:12px; --n-text-color:rgb(51, 54, 57); --n-caret-color:#18a058; --n-text-decoration-color:rgb(51, 54, 57); --n-border:1px solid rgb(224, 224, 230); --n-border-disabled:1px solid rgb(224, 224, 230); --n-border-hover:1px solid #36ad6a; --n-border-focus:1px solid #36ad6a; --n-placeholder-color:rgba(194, 194, 194, 1); --n-placeholder-color-disabled:rgba(209, 209, 209, 1); --n-icon-size:16px; --n-line-height-textarea:1.6; --n-color-disabled:rgb(250, 250, 252); --n-color-focus:rgba(255, 255, 255, 1); --n-text-color-disabled:rgba(194, 194, 194, 1); --n-box-shadow-focus:0 0 0 2px rgba(24, 160, 88, 0.2); --n-loading-color:#18a058; --n-caret-color-warning:#f0a020; --n-color-focus-warning:rgba(255, 255, 255, 1); --n-box-shadow-focus-warning:0 0 0 2px rgba(240, 160, 32, 0.2); --n-border-warning:1px solid #f0a020; --n-border-focus-warning:1px solid #fcb040; --n-border-hover-warning:1px solid #fcb040; --n-loading-color-warning:#f0a020; --n-caret-color-error:#d03050; --n-color-focus-error:rgba(255, 255, 255, 1); --n-box-shadow-focus-error:0 0 0 2px rgba(208, 48, 80, 0.2); --n-border-error:1px solid #d03050; --n-border-focus-error:1px solid #de576d; --n-border-hover-error:1px solid #de576d; --n-loading-color-error:#d03050; --n-clear-color:rgba(194, 194, 194, 1); --n-clear-size:16px; --n-clear-color-hover:rgba(146, 146, 146, 1); --n-clear-color-pressed:rgba(175, 175, 175, 1); --n-icon-color:rgba(194, 194, 194, 1); --n-icon-color-hover:rgba(146, 146, 146, 1); --n-icon-color-pressed:rgba(175, 175, 175, 1); --n-icon-color-disabled:rgba(209, 209, 209, 1); --n-suffix-text-color:rgb(51, 54, 57);"><div class="n-input-wrapper"><!----><div class="n-input__textarea n-scrollbar" role="none" style="--n-scrollbar-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-scrollbar-color:rgba(0, 0, 0, 0.25); --n-scrollbar-color-hover:rgba(0, 0, 0, 0.4); --n-scrollbar-border-radius:5px; --n-scrollbar-width:5px; --n-scrollbar-height:5px;"><textarea class="n-input__textarea-el" rows="3" placeholder="Ask me anything...(Shift + Enter = line break)"></textarea><div class="n-input__placeholder" style="top: 0px;">Ask me anything...(Shift + Enter = line break)</div><div class="n-input__textarea-mirror" style="min-height: 35.4px; max-height: 57.8px;">
</div><!----><!----></div><div class="n-scrollbar-rail n-scrollbar-rail--vertical n-scrollbar-rail--disabled" data-scrollbar-rail="true" aria-hidden="true"><!----></div><!----></div><!----><!----><div class="n-input__border"></div><div class="n-input__state-border"></div><!----></div><!----></div><div><button class="flex items-center justify-center w-10 h-10 transition rounded-full hover:bg-neutral-100 dark:hover:bg-[#414755]"><span class="text-xl text-[#4f555e] dark:text-white"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M13 10h5l-6 6l-6-6h5V3h2v7Zm-9 9h16v-7h2v8a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-8h2v7Z"></path></svg></span></button></div><div><button class="flex items-center justify-center w-10 h-10 transition rounded-full hover:bg-neutral-100 dark:hover:bg-[#414755]"><span class="text-xl text-[#4b9e5f]"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10a9.956 9.956 0 0 1-4.708-1.175L2 22l1.176-5.29A9.956 9.956 0 0 1 2 12C2 6.477 6.477 2 12 2Zm0 2a8 8 0 0 0-8 8c0 1.335.326 2.618.94 3.766l.35.654l-.656 2.946l2.948-.654l.653.349A7.955 7.955 0 0 0 12 20a8 8 0 1 0 0-16Zm1 3v5h4v2h-6V7h2Z"></path></svg></span></button></div><button class="n-button n-button--primary-type n-button--medium-type n-button--disabled" tabindex="-1" type="button" style="--n-bezier:cubic-bezier(0.4, 0, 0.2, 1); --n-bezier-ease-out:cubic-bezier(0, 0, 0.2, 1); --n-ripple-duration:0.6s; --n-opacity-disabled:0.5; --n-wave-opacity:0.6; font-weight: 400; --n-color:#18a058; --n-color-hover:#36ad6a; --n-color-pressed:#0c7a43; --n-color-focus:#36ad6a; --n-color-disabled:#18a058; --n-ripple-color:#18a058; --n-text-color:#FFF; --n-text-color-hover:#FFF; --n-text-color-pressed:#FFF; --n-text-color-focus:#FFF; --n-text-color-disabled:#FFF; --n-border:1px solid #18a058; --n-border-hover:1px solid #36ad6a; --n-border-pressed:1px solid #0c7a43; --n-border-focus:1px solid #36ad6a; --n-border-disabled:1px solid #18a058; --n-width: initial; --n-height:34px; --n-font-size:14px; --n-padding:0 14px; --n-icon-size:18px; --n-icon-margin:6px; --n-border-radius:3px;" disabled=""><!----><span class="n-button__icon" style="margin: 0px;"><div class="n-icon-slot" role="none"><span class="dark:text-black"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class=" iconify iconify--ri" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M1.946 9.316c-.522-.175-.526-.456.011-.635L21.043 2.32c.529-.176.832.12.684.638l-5.453 19.086c-.151.529-.456.547-.68.045L12 14l6-8l-8 6l-8.054-2.684Z"></path></svg></span></div></span><!----><div aria-hidden="true" class="n-base-wave"></div><div aria-hidden="true" class="n-button__border"></div><div aria-hidden="true" class="n-button__state-border"></div></button></div></footer></div><!----></div></div></div></div></div><!----></div><div></div><!----><!----></div></div>
	



<!----><div class="v-binder-follower-container" style="z-index: 2000;"><div class="v-binder-follower-content" v-placement="top" style="--v-target-width:40px; --v-target-height:40px; --v-offset-left:0px; --v-offset-top:0px; transform: translateX(361px) translateY(859px) translateY(-100%) translateX(-50%); --v-transform-origin:bottom center; transform-origin: center bottom;"><!----></div></div><div id="v-binder-view-measurer" style="position: fixed; inset: 0px; pointer-events: none; visibility: hidden;"></div></body></html>